Ich hab noch einen ähnlichen Fall. Die CSS-Datei hab ich nicht selbst geschrieben, und sie verwendet diese "before" und "after"-Befehle, die ich eigentlich gar nicht kenne. CLASS und ID - Elemente für CSS-Design ansprechen. Also jedenfalls in einem Div ist ein Bild: HTML-Code:
Es gibt schier unendlich viele Möglichkeiten, Elemente mit CSS anzusprechen. Zumindest sind Neueinsteiger dieser Materie ersteinmal überfragt. Wir sollten nun klären, wie wir HTML-Elemente ansteuern können, denn genau das ist der Sinn von CSS. Manipulieren stylen von HTML Tags. Du benötigst für dieses Tutorial eine HTML Seite und idealerweise eine CSS Datei. Inhaltsverzeichnis dieser Seite: 1. universal Selektor 2. Tag Selektor / Typ Selektor 3. ID Selektor 4. CLASS Selektor Vorwort: Idealerweise schreiben wir alle HTML Tags klein, so ist die Regel. Übertragbar auf CSS wird auch da alles klein geschrieben. Außnahmen bilden Dateinamen, sowie ID/CLASS Selektoren, wo Elementbenamungen z. B. Css mehrere klassen ansprechen 1. : class="noBorder" bereits Großbuchstaben beinhalten. Mehrere CLASS Selektoren werden per Leerzeichen getrennt z. : class="noBorder border5px". Verboten sind bei der Benamung Leerzeichen, Sonderzeichen und Umlaute (ä, ü, ö). Zahlen dürfen nicht am Anfang enthalten sein ( falsch: class="5pxBorder", richtig: class="Border5px", besser: class="border5px").
Es ist also etwas einmaliges, denn ID-Namen dürfen nur einem HTML Element zugewiesen werden. Beispiel:
Text..Ansteuerung: Ansteuerung mit dem ID Selektor über das Raute Symbol: # Es darf nun kein weiteres HTML Element mit der id="elementname" auf der aktuellen Seite mehr vorkommen. Code: Dies ist mein Beispieltext. Ich versuche CSS zu lernen,
da ich gern ein schmuckes Webdesign erstellen möchte. Der CLASS-Selektor: einzelne Elemente ansteuern Eine class (sprich: Klasse) kann mehrmals zugewiesen werden. Dies hat den Vorteil nur die notwendigen Klassen einem HTML Element zu geben. Größere Style-Zuweisungen können dann geteilt werden. Dies zeigt ein Praxisnahes Beispiel mit einer weiteren Besonderheit. Code: