Witam,
Jak to jest z specyficznością w CSS
Przeglądam różne materiały na youtube np:
lub
Mowa jest w tych filmach o punktacji czyli ze znacznik jest za 1 punkt classa za 10 a id za 100 ale id nie da się przebić nawet 20 classami, to błąd autorów?
0
0
Specyfikacją selektora nie jest pojedyncza liczba złożona z sumy pod-selektorów (tak jak się w uproszczeniu to przedstawia) - każdy ze pod-selektorów działa niezależnie.
0
Czyli jak to rozumieć? jak to sobie liczyć? żeby z głowy wiedzieć co będzie miało pierwszeństwo?
0
dodatkowo nie wiem po co miałbyś przebijać id aż 20 class, jaki sens miałby taki kod, już chyba prościej byłoby sporadycznie użyć !important
0
To był tylko przykład, po prostu chce zrozumieć mieć świadomość jak to działa
0
Raczej wskaźnika specyficzności nie przelicza się w głowie - wystarczy, abyś wiedział, że id jest ważniejsze od klasy itd., reszta przyjdzie wraz z wprawą.
0
Patryk27 napisał(a):
Raczej wskaźnika specyficzności nie przelicza się w głowie - wystarczy, abyś wiedział, że id jest ważniejsze od klasy itd., reszta przyjdzie wraz z wprawą.
OK rozumiem
Pozdrawiam :)
0
tutaj pomaga devtools chrome czy ff, sprawdzasz, która klasa jest aktywna, która wykreślona to pozwala znaleźć problem i go rozwiązać, jeśli, oczywiście, taki jest
0
Ale po co stosować takie dziwne konstrukcje i zagnieżdżenia skoro w BEM promuje się stosowanie pojedynczych klas lub maksymalnie 2 zagnieżdżonych klas jak np.
.block {}
.block__element {}
/* max 2 classes */
.block .block__element {}
Dobrze mówię?
0
Po co stosować jakie dziwne konstrukcje i zagnieżdżenia?
Btw, BEM nie jest jedyną istniejącą praktyką i ma tak samo zwolenników, jak i przeciwników - just sayin'.
0
Szczerze mówiąc mniej więcej ogarniam z głowy która będzie miała pierwszeństwo czasem tez zaglądam do devtools chrome'a jeśli jest taka potrzeba
Po prostu chciałem zrozumieć jak to dokładnie działa
0
no i bardzo dobrze, po to jest żeby zaglądać ;)
0
No jak to jakie? Takie, które sprawiają, że cssowski kod staje się trudny w opanowaniu i modyfikacji. Rozmawiamy o specyficzności selektorów, które powinny być proste, a nie złożone i zbyt głębokie jak np. poniższy lub ten od autora wątku.
header.header > nav.navigation > ul.navigation-list > li.navigation-item > a.navigation-link {}
0
Jeśli piszesz w Sassie, taki kod może być jak najbardziej czytelny i prawidłowy.
Jeśli natomiast piszesz w czystym CSSie, to mogę tylko współczuć ;-)
0
A Sass/SCSS/LESS nie kompilują tych ichniejszych zagnieżdżeń do właśnie takiej formy jak wyżej? Chyba kompilują. I chyba to nie jest najlepsze rozwiązanie.
Ziom, ale o co ci chodzi?
Chodzi mi o to, że pojedynczy selektor klasy jest szybszy niż selektor zawierający różne kombinacje zawierające selektor elementu, klasy, id i inne pozostałe wynalazki.
0
Chodzi mi o to, że pojedynczy selektor klasy jest szybszy niż selektor zawierający różne kombinacje zawierające selektor elementu, klasy, id i inne pozostałe wynalazki.
Pokaż mi statystyki opisujące różnice w prędkości parsowania różnych selektorów CSSów, na rzeczywistych przykładach.
0
W3C opisuje jak to działa bardzo prosto, więc nie wiem o co cała dyskusja
0
Według mnie zapomnieliście o fakcie, że pisząc byle jaki kod sami robicie sobie problemy. CSS powinien być tak napisany aby był wydajny, prosty, czytelny, modyfikowalny i z łatwością umożliwiał przenoszenie fragmentów strony pomiędzy różnymi jej częściami. Dlatego też nie polecam korzystać ze wszystkich dobrodziejstw oferowanych przez preprocesory i bez potrzeby pisania tego słynnego kodu polegającego na zagnieżdżenia selektorów, bo "ładnie wygląda i nie ma wpływu na nic". Sporo takich kwiatków widziałem i później płacz, że przy zmianie HTML trzeba zmieniać CSS.