CSS: Difference between revisions

From Medien Wiki
Line 96: Line 96:
<source lang="CSS">selector { property: value; }</source>
<source lang="CSS">selector { property: value; }</source>


Der selector wird auch als class bezeichnet
Selektoren wird auch als Klassen (Class) bezeichnet.


Übersicht Selektoren:
 
=== Übersicht Selektoren/Formate:===
{| {{Template:Prettytable}}
{| {{Template:Prettytable}}
|-
|-
Line 108: Line 109:
|-
|-
| HTML Tags
| HTML Tags
| Format für bestehende HTML-Tags
| HTML-Tag Formate<ref>Es können selbstverständlich nur Selektoren aus bestehenden HTML-Tags gewählt werden</ref>
| Selektor heißt: <tt>tag</tt>
| <source lang="CSS">selector</source >
| <source lang="CSS">p { color:red; }</source>
| <source lang="CSS">p { color:red; }</source>
| <source lang="HTML4Strict"><p>Text</p></source>
| <source lang="HTML4Strict"><p>Text</p></source>
|-
|-
| Custom Class
| Custom Class
| Eigene Formate
| Eigene Formate<ref>Es müssen eigene Namen vergeben werden, die üblicherweise entweder die grafischen Eigenschaften oder die Zugehörigkeit zu bestimmten Layout-Elementen klar benennt.</ref>
| Selektor beginnt mit einem Punkt <tt>.</tt>
| <source lang="CSS">.selector</source >
| <source lang="CSS">.red { color:red; }</source>
| <source lang="CSS">.red { color:red; }</source>
| <source lang="HTML4Strict"><p class="red">Text</p></source>
| <source lang="HTML4Strict"><p class="red">Text</p></source>
|-
|-
| ID
| ID
| Universelle ID (Box System)
| Universelle ID<ref>Die ID darf nur ein einziges Mal vergeben sein! Üblicherweise werden IDs zur Positionierung von Layout-Elementen (Boxen) verwendet</ref>
| Selektor beginnt mit einer Raute <tt>#</tt>
| <source lang="CSS">#selector</source >
| <source lang="CSS">#myID { position:fixed; left:25px; }</source>
| <source lang="CSS">#myID { position:fixed; left:25px; }</source>
| <source lang="HTML4Strict"><div id="myID"><p>Text</p></div></source>
| <source lang="HTML4Strict"><div id="myID"><p>Text</p></div></source>
|}
|}
<references/>


== Editieren von Stylesheets ==
== Editieren von Stylesheets ==