Ponašanje CSS selektora

Linux pomoć Programiranje
1

CSS class selektori

.federation.tooltip - ovo je uobičajno (bez razmaka)
.federation,.tooltip - i ovo je uobičajno (sa zarezom)

E al ovo me zbunjuje:

.federation .tooltip - sa razmakom je ponašanje koje ne razumijem.
Piše da je ovo nedozvoljena situacija, al sam našao primjer u kom se koristi.

.tooltip {
display: block;
font-size: smaller;
left: 0;
padding: 5px;
position: absolute;
top: 1.7em;
width: 15em;
z-index: 1;
}

.federation .tooltip {
background: #C0C0FF url(starfleet.png) top left no-repeat;
color: #2E2E33;
min-height: 54px;
padding-left: 64px;
}

HTML:

2

http://www.w3.org/TR/CSS2/selector.html#class-html
http://www.w3.org/TR/CSS2/selector.html#descendant-selectors
http://www.w3.org/TR/CSS2/selector.html#grouping

Ali nisam siguran za to .federation.tooltip, ne vjerujem da sam to ikad vidio.

3

http://jigsaw.w3.org/css-validator/

http://validator.w3.org/

4

Odgovor je vrlo jednostavan, koristiš “descendant” selektor, ali HTML elementi nisu jedan unutar drugog!

Pretpostavljam da bi za “.federation .tooltip” selector pravilo umjesto

radilo

5

Upravo tako - to me i zbunjivalo.Ovaj HTML elementi su u stvari polubraća (sibling) - imaju istog roditelja. Povezani su roditeljem - span klasom koja ih sadrži kao omotač.A ta span klasa opet ima dva imena, tolltipcontainer (globalni omotač) i federation. Znači federation ispred tooltip u CSS-u služi samo da označi pripadnost elementu - nema direktan uticaj u smislu promjene svojstava.

Pomalo netipično, jebi ga.

Inače primjer je u stvari priprema za Javaskript manipulaciju HTML elementima.