fortbildungen:webdesign-lernen:css-spickzettel
Unterschiede
Hier werden die Unterschiede zwischen zwei Versionen angezeigt.
Beide Seiten der vorigen RevisionVorhergehende ÜberarbeitungNächste Überarbeitung | Vorhergehende Überarbeitung | ||
fortbildungen:webdesign-lernen:css-spickzettel [18.11.2015 (11:43)] – [Kommentare] retemirabile | fortbildungen:webdesign-lernen:css-spickzettel [06.08.2020 (11:28)] (aktuell) – Externe Bearbeitung 127.0.0.1 | ||
---|---|---|---|
Zeile 17: | Zeile 17: | ||
- | {{youtube> | + | {{youtube> |
===== Prinzip von CSS ===== | ===== Prinzip von CSS ===== | ||
Zeile 38: | Zeile 37: | ||
===== Aufbau einer CSS-Regel ===== | ===== Aufbau einer CSS-Regel ===== | ||
- | Eine CSS-Regel besteht aus dem **Selektor // | + | Eine CSS-Regel besteht aus dem **Selektor // |
{{: | {{: | ||
Zeile 47: | Zeile 46: | ||
|<100% 15em 10em >| | |<100% 15em 10em >| | ||
^Name^Beispiel^Erklärung^ | ^Name^Beispiel^Erklärung^ | ||
- | |Element-Selektor |'' | + | |Element-Selektor |'' |
|mehrere Element-Selektoren|'' | |mehrere Element-Selektoren|'' | ||
|verschachtelte Element-Selektoren|'' | |verschachtelte Element-Selektoren|'' | ||
|ID-Selektor|''# | |ID-Selektor|''# | ||
|class-Selektor|'' | |class-Selektor|'' | ||
- | |Pseudo-Klasse-Selektor|'': | + | |Pseudo-Klasse-Selektor|'': |
Zeile 60: | Zeile 59: | ||
- | Wenn man beginnt, mit CSS zu arbeiten helfen die folgenden Eigenschaften schnell weiter. Wenn man konkrete Ideen hat, die darüber hinaus gehen, sollte man sich mit einer Referenz-Website wie z.B. **[[http:// | + | Wenn man beginnt, mit CSS zu arbeiten, helfen die folgenden Eigenschaften schnell weiter. Wenn man konkrete Ideen hat, die darüber hinaus gehen, sollte man sich mit einer Referenz-Website wie z.B. **[[http:// |
Zeile 68: | Zeile 67: | ||
Anstatt z.B. '' | Anstatt z.B. '' | ||
- | **Beispiel** | + | |
- | Die folgenden beiden Beispiele sind in ihrer Wirkung identisch: | + | Die folgenden beiden |
<code css> | <code css> | ||
Zeile 100: | Zeile 99: | ||
|[[http:// | |[[http:// | ||
|[[http:// | |[[http:// | ||
- | |||
Zeile 189: | Zeile 187: | ||
| | ||
- | <!-- Hier stehen weitere HTML-Elemente, die dem jeweiligen | + | <!-- Hier stehen weitere HTML-Elemente --> |
- | | + | |
- | unten zu sehen --> | + | |
| | ||
fortbildungen/webdesign-lernen/css-spickzettel.1447843400.txt.gz · Zuletzt geändert: 06.08.2020 (10:37) (Externe Bearbeitung)