Specyficzność CSS (Specificity) w skrócie
- Author: nbw
- Filed under: jogger
Jun 21,2005
Zauważyłem, przeglądając różnego typu kursy, że specyficzność CSS jest tematem bardzo rzadko poruszanym (jeśli nie wcale; pobieżnie szukając u Zeldmana nie znalazłem, widziałem w spisie treści u Meyera). O co chodzi?
Mamy styl:
div p {color: #00b;}p {color: #f00;}
Jakim kolorem zostanie wpisany tekst w <div><p>tekst<p><div>?
Biorąc pod uwagę to, czego można się dowiedzieć z większości kursów: czerwonym, bo p jest niżej niż div p.
Nie jest to prawda. Tekst będzie niebieski. Właśnie ze względu na wspomnianą specyficzność.
Elementy w CSS mają różne wartości. Tag HTML ma najniższą, równą 1; klasa ma wartość 10 a identyfikator jest równy 100. Zatem p w naszym przykładzie = 1, a div p = 2.
Zatem div#id p.klasa “wygra” z div p niezależnie od kolejności w jakiej zostaną ułożone.
O autorze
Nazywam się Tomasz Staniak, zajmuję się prowadzeniem/tworzeniem projektów internetowych. Na blogu przeczytasz o tym, co mnie interesuje a także z czym jestem związany zawodowo.
Kontakt
Projekty
Categories
Archives
- August 2008
- March 2008
- February 2008
- January 2008
- November 2007
- August 2007
- March 2007
- January 2007
- December 2006
- November 2006
- October 2006
- August 2006
- July 2006
- June 2006
- May 2006
- April 2006
- March 2006
- February 2006
- October 2005
- September 2005
- August 2005
- July 2005
- June 2005
- May 2005
- April 2005
- March 2005
- February 2005
- January 2005
- December 2004
- November 2004
- October 2004
Meta
Recent Comments
- Billigflüge: Thank You for another very
- nbw: test
- Tomasz Staniak: test
- kabturek: Gra jest świetna, chociaż troche
- CoSTa: Fajne! Ale jeśli już marnować
- medraka: Fajna gra, a prosta grafika
- reod: [ot]Ło ale wpytowy design! ;-)[/o]
- Jajcuś: nbw: w Longturnie bywało że
- nbw: Właśnie nie wiem, czy szukam
- Jajcuś: Jak interesuje Ciebie coś w
25 Responses for "Specyficzność CSS (Specificity) w skrócie"
Chyba jednak się mylisz.
<p>Będzie czerwony</p>
<div><p>Będzie niebieski</p></div>
To dość logiczne.
Oczywiście, Łukaszu, masz rację - już poprawiam. Za duży skrót myślowy zrobiłem.
Akurat specificzność w CSS jest tak fajnie zrobiona,
że po prostu prawie zawsze działa tak jak się wydaje najbardziej logiczne. Nawet nie trzeba myśleć jakim algorytmem to jest wyliczane, po prostu działa.
Tomku, nadal nie widać "tekst będzie niebieski". Zwykły tekst w akapicie (element <P>) będzie czerwony. Jeśli zaś mamy <DIV id="container"> i żadnego innego elementu <DIV> po drodze, to akapit będzie niebieski.
Chodzi przede wszystkim o p w divie. Zatem:
<p>tekst</p> będzie czerwony ale
<div><p>tekst</p></div> będzie niebieski i o to chodziło
Heh, właśnie przez to, co opisujesz, miałem na początku wielkie problemy ze stylowaniem linków. A okazywało się, że po prostu niektóre reguły były ważniejsze niż inne.
Ciekawi mnie też co daje !important.. mógłbyś to opisać za jakiś czas.
Tak, ale ja lepiej najpierw pójdę się wyspać, bo sądząc po tej notce, i słusznych uwagach Łukasza, mam dziś tendencję do komplikowania spraw prostych i pomijanie spraw kluczowych
Jajcus: jest i pewnie dlatego nikt jej nie opisuje, bo w życiu codziennym nie ma większego znaczenia.
I dlatego kiedyś ktoś mnie zapytał o to i nie wiedziałem co odpowiedzieć
> Ciekawi mnie też co daje !important.. mógłbyś to opisać za jakiś czas.
A co tu opisywać. W standardzie jest to ładnie opisane: http://www.w3.org/TR/CSS21/cascade.html
!important ma wpływ na kaskadę. Style są aplikowane wg takiej kolejności:
1. user agent style sheets
2. user normal style sheets
3. author normal style sheets
4. author important style sheets
5. user important style sheets
!important nie jest do stosowania w kodzie CSS strony, służy do budowy arkuszy użytkownika.
A jaj mam pytanie, czemu wciąż stosujesz jakie trzycyfrowe oznaczenia kolorów, zamiast sześciocyfrowych?
Trzy znaki szesnastkowe rozwija się następująco:
#abc == #aabbcc
Najprościej rzecz ujmując, brakujące znaki są powielane ze znaków je poprzedzających.
quiris: Może pomyślisz, że jestem nudny
ale bede Cie prześladował dotąd, aż przestaniesz pisać, że CSS 2.1 to standard. Otoż CSS 2.1 jest w statusie Working Draft. Standard to CSS 2.
> Otoż CSS 2.1 jest w statusie Working Draft. Standard to CSS 2.
W porządku i co z tego, że CSS 2.0 to standard? CSS 2.1 Working Draft zdecydowanie bardziej przystaje do obecnej rzeczywistości przeglądarkowej niż CSS 2.0 Standard.
Anne van Kesteren napisała nawet ostatnio w http://annevankesteren.nl/2005/06/css-21:
If you’re still in doubt whether to refer your friends to CSS 2.0 or CSS 2.1. Please point them to the latter as that is the specification that reflects reality.
Nie chcę cię rozczarować, ale Anne to chłopiec
Hę? Faktycznie
W dzisiejszych czasach niczego nie można być pewnym..
quiris: spokojnie…
Napisalem, ze CSS 2.1 nie jest standardem, dopiero za jakis czas bedzie. Mysle, ze sie zgodzisz bo kilkanascie dni temu rozmawialismy na innym blogu, ze CR jest OK a WD nie. Nie pisz mi o tym co przystaje a co nie bo ja zupelnie nie o tym pisalem. Ale skoro juz poruszyles ten temat to faktycznie na cala specyfikacje wprowadzono dwie rzeczy powodujace, ktore z pewnoscia powoduja, ze CSS 2.x staje sie bardziej aktualne: orange i PI do stylow. Nic wiecej, reszta to chlam i dlatego jest w WD a nie w CR. Co do cytatu to nigdy takiego systemu "odpowiedzi" nie rozumialem. Co to niby ma udowodnic…? Moze lepiej przytoczyc zdanie wiekszosci z WG?
> Napisalem, ze CSS 2.1 nie jest standardem, dopiero za jakis czas bedzie
A czy ja napisałem coś innego?
> Nic wiecej, reszta to chlam i dlatego jest w WD a nie w CR.
CSS 2.1 jest obecnie w fazie WD ponieważ wprowadzono ostatnio bardzo dużą liczbę poprawek błędów, uściśleń itp. Edytorzy czekają do 15 lipca na komentarze do zmian. Po wprowadzeniu ewentualnych zmian CSS 2.1 znowu wejdzie w stan rekomendacji kandydującej i stanie się dopiero wtedy prawdziwym standardem, gdy znajdą się dnie niezależne implementacje całego standardu.
To są jedyne merytoryczne przyczyny obecnego stanu CSS 2.1.
Tak napisales, wyzej ze CSS 2.1 to standard. A ja na to odpowiedzialem, ze nie.
>CSS 2.1 jest obecnie w fazie WD ponieważ (…)
No wlasnie. Ladnie ujalec moje slowa. A ja pozwole sobie je jeszcze bardziej rozwinac. Specyfikacja CR byla chlamem bo nie byla jednolita i zawierala od cholere bledow dlatego wprowadzono poprawki, ktore trzeba przeprowadzic przez proces weryfikacji wiec dalej mamy WD i caly czas specyfikacja sie zmienia. Zreszta zupelnie na marginesie to edytorzy nie mieli pozwolenia na publikacje CR.
> Tak napisales, wyzej ze CSS 2.1 to standard. A ja na to odpowiedzialem, ze nie.
Ok. CSS 2.1 to standard w fazie szkicu roboczego.
> Specyfikacja CR byla chlamem bo nie byla jednolita i zawierala od cholere bledow dlatego wprowadzono poprawki
Idąc twoim tokiem rozumowania to muszę powiedzieć, że CSS 2.0 jest jeszcze gorszym chłamem, bo zawiera jeszcze więcej błędów, niejasności, rzeczy niemożliwych do zaimplementowania itd. CSS 2.1 nawet jako WD lepiej przystaje do rzeczywistości niż CSS 2.0 To nie sztuka wyprodukować standard, sztuką jest wprowadzenie go w życie i to akurat w przypadku CSS 2.0 nie udało się i taki stan rzeczy właśnie CSS 2.1 usiłuje poprawić.
> Ok. CSS 2.1 to standard w fazie szkicu roboczego.
Nie, nie jest OK. Nie jest rzadnym standardem. Jest specyfikacja w fasie szkicu. Standardem bedzie jak specyfikacja stanie jest rekomendacja.
> Specyfikacja CR byla chlamem bo nie byla jednolita i zawierala od cholere bledow dlatego wprowadzono poprawki
Z calym szacunkiem ale nie poszedles moim tokiem rozumowania. CSS 2.0 zawieral dwa bledy, ktore zostaly poprawione w CSS 2.1. A CSS 2.1 zawieral tak mniej wiecej 30 bledow, dalej zawira mniej wiecej 10 bledow i zapewne ta liczba wzrosnie. Wlasnie dlatego nie jest standardem, dlatego nie jest CR tylko jest WD. Tak jak wczesniej obiecalem, ze cofniemy ten chlam bo zawiera bledy tak tez sie stalo. Ale Ty wolales zostac przy swoim. Dalej mowie Ci to (jako ktos kto bieze udzial w pisaniu CSS 2.1), ze WD CSS 2.1 dalej zawiera bledy ale Ty oczywisie musisz zanegowac wszystko automatycznie. Bo w glowie masz taki program wyszukujacy slowo kluczowe Domel i jak je znajdzie to negujesz wszystko, nawet to czego sie zanegowac nie da. :/
> Tak jak wczesniej obiecalem, ze cofniemy ten chlam bo zawiera bledy tak tez sie stalo.
O cho, cho. Widzę, że już mienisz się być współautorem CSS 2.1. Gratuluję szybkiego rozwoju.
> Widzę, że już mienisz się być współautorem CSS 2.1.
Jak zwykle zle widzisz. Wspolautorow jest 4 (bylo trzech ale Hixie wkrecil jeszcze swojego ziomka). A pozostale 100 osob tylko im pomaga. Tak jak kiedys napisalem generalnie nie zgadzam sie z filozofia CSS wiec raczej ograniczam sie w pomocy.
> Gratuluję szybkiego rozwoju.
Dlaczego czuje, ze to jest nieszczere? (pytanie retoryczne)
> A pozostale 100 osob tylko im pomaga.
Domel, jak mniemam pomagasz im jako Dominik Tomaszuk? Prawda?
Prawda
a czemu pytasz?
Moze przejdzmy na priv, bo nasz czat leciutko schodzi z tematu
Leave a reply