CSS

Der Inhalt ist erst nach dem Einloggen sichtbar

Themen:


Introduction ⇑
a ⇑
animation_keyframes ⇑
background ⇑
blank ⇑
border-radius ⇑
border ⇑
box-sizing ⇑
calc ⇑
child ⇑
clear ⇑
clip-path ⇑
content ⇑
cursor ⇑
display ⇑
div ⇑
filter ⇑
flexbox ⇑
float ⇑
font ⇑
form ⇑
grid ⇑
hover ⇑
hyphens ⇑
img ⇑
important ⇑
is ⇑
li ⇑
margin ⇑
menue_hover_horizontal ⇑
menue_hover_vertical ⇑
not ⇑
of-type ⇑
opacity ⇑
optional ⇑
outline ⇑
overflow ⇑
padding ⇑
position ⇑
responsive ⇑
selection ⇑
selektoren ⇑
span ⇑
target ⇑
transform ⇑
transition ⇑
var ⇑
viewport ⇑
where ⇑
z-index ⇑
zoom ⇑

Anzahl an Themen: 51

Aktuell geöffnete Datei: 'selektoren'

Zum Wechseln des Themas einfach ein neues Thema eingeben

CSS_selektoren

Selektoren - Das Ansprechen der Elemente

div {
Alle Div-Elemente werden angesprochen, egal welche Attribute
}

p {
Alle p-Elemente werden angesprochen, egal welche Attribute
}

Attribute - Das Ansprechen der Elemente mit CSS über ihre Attribute und Werte

.div {
     Alle Elemente mit class="div" werden angesprochen
}

#id {
     Alle Elemente mit der id="id" werden angesprochen
}

div.test {
     Divs mit class="test" werden angesprochen
}

.div .test { (auch p em)
     Elemente mit der class="test" im Element mit der class="div" werden angesprochen
}

.div, .test {
     Elemente mit der class="div" und Elemente mit der class="test" werden angesprochen
}

p > i {
     alle reinen i-tags, innerhalb eines p-tags werden angesprochen (Kindselektor)
}

h1 + p {
     Das direkt anschließende reine p-Element, dass nach dem h1-Element kommt wird angesprochen (hover: identisch)
}

p + p {
     Das direkt anschließende reine p-Element, dass nach dem p-Element kommt wird angesprochen (bei mehreren p-Elementen unmittelbar hintereinander, alle Folgenden bis zur Unterbrechnung - hover: immer nur das folgende reine p-Element)
}

h1 ~ p {
     Alle p-Elemente, die nach h1 kommen und auf gleicher Ebene sind (Geschwisterkombinator) (bei mehreren p-Elementen unmittelbar hintereinander, alle Folgenden selbst bei anderen Elementen dazwischen - hover identisch)
}

[title] {
     Alle Elemente mit einem Titel werden angesprochen
}

a[target] {
     Alle As mit dem Attribut target werden angesprochen
}

a[type="text"] {
     Alle As mit dem Attribut type und dem Wert text werden angesprochen
}

a[target=_blank] {
     Alle As mit dem Attribut target und dem Wert _blank
}

[title~=flower] {
     Alle Elemente mit einem Titel und dem Wert flower
}

[class|=top] {
     Element mit dem Attribut class, dass beginnt mit top und keine Weiteren Werte besitzt, die nicht mit einem "-" verbunden sind
}

[class^="top"] {
     Element mit dem Attribut class, dass mit top beginnt, auch topclass; top tip; top-head
}

[class$="test"] {
     Element mit dem Attribut class, bei dem der letzte Wert, die letzten Buchstaben 'test' sein müssen. (auch actest; ac test; ac-test)
}

[class*="te"] {
     Element mit dem Attribut class, das irgendwo und irgendwie ein 'te' besitzt
}

Pseudoklassen oder Pseudoelemente sind hier nicht aufgezählt sondern als Thema einsortiert.