Cascading Style Sheets

Zweck: Das Aussehen von Elementen verschönern - Links speziell zu css-Menue

CSS-Regel erstellen
  1. Datei muss abgespeichert sein.
  2. CSS öffnen - (falls untenstehende Darstellung mit "Neue Style-Regeln" nicht erscheint - auf die dort oben links stehend Farbpalette klicken und REGEL anklicken)
  3. Style Regel einer Klasse anklicken und einen PUNKTnamen vergeben. Dann Button "Style-Regel erstellen"[NICHT OK/Enter drücken!].


  1. erstellte Regel links anklicken und gewünschtes Format erstellen.


  1. hier am Bspeispiel für das Aufführungsbild einer Liste

CSS-Regel anwenden

  1. zu formaierendes Objekt markieren
  2. in der untersten Zeile das Objekt(body - div - table - ol....) markieren
  3. und oben die Klasse auswählen(Feld oberhalb von BIU)



Eine Einführung und Übung daher nur als PDF



Eigenes Menue per css erstellen:

<div> erstellen - s. Haupttext per Ausrichtung oder Sie haben zwei beliebige Texte(hier Menue und Haupttext, die Sie zu <div> erklären - per:
Generic container(div)
Wenn Sie nun auf einem der beiden Worte stehen, wird in der Statusleiste(unten) neben body .... nun auch <div> gegezeigt.
Falls Sie den beiden <div> einen eigenen Namen geben wollen,
auf das Wort <div> in der Statursleiste RMT-> Erweitere Einstellungen - Karte HTML - dort Attribut ID unten auswählen und rechts daneben einen sinnvollen Namen schreiben.



css-menue senkrecht
css-menue waagerecht




Zusatzinfo:
man kann die Style-Regeln auch in eine eigenständige Datei exportieren(Suffix beliebig - i.d.R. css).
Auf diese eigenständige Datei kann man dann über @import auch aus anderen Dateien zugreifen.

Mehr Infos?
extern -> Internet:
selfhtml
w3schools

Codeschnipsel
von:
 w3schools z.B.: image Zoom(Lupe)
codepen (search pen und oben Suchbegriff eingeben)