Forum PHP.pl > kolejnosc wykonywania polecen css

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: kolejnosc wykonywania polecen css

Forum PHP.pl > Forum > Po stronie przeglądarki > CSS

kufalo

6.09.2011, 13:15:59

Witam,
Czy moze mi ktos na podstawie przykladu ponizej wyjasnic dlaczego wyswietlany prostokat jest szary a nie czarny? Bylem pewny, ze ostatnia wartosc w stylu przypadajaca na dany element jest brana pod uwage...

[HTML] pobierz, plaintext 
<!DOCTYPE html>
<html>
 <head>
  <style type="text/css">
 
   #a{opacity:0.1}
   .b{opacity:1}
 
  </style>
 </head>
 <body>
  <div id="a" class="b" style="background:black">...</div>
 </body>
</html>
[HTML] pobierz, plaintext

!*!

6.09.2011, 13:18:57

Ponieważ id jest tak jakby "wyżej" od klasy.

nospor

6.09.2011, 13:20:04

w css nie liczy się kolejność a ważność.

#a jest ważniejsze od .b stad div ma nadal opacity 0.1

kufalo

6.09.2011, 13:22:37

Ok,
Ma ktos moze pod reka jakas tabelke z waznoscia poszczegolnych deklaracji css ?

!*!

6.09.2011, 13:25:57

Ważność deklaracji CSS? A co to jest? Wątpię że jest taka tabela. Przeczytaj od czego jest ID i CLASS oraz o ich dziedziczeniu, to wystarczy.

kufalo

6.09.2011, 13:27:39

No wlasnie chodzi mi o tabelke ze specyfikacji css definiujaca to co jest wazniejsze od czego... Przyklad: id wazniejsze od klasy

!*!

6.09.2011, 13:29:38

Przecież nie ma "niczego" więcej. To co chcesz mieć w tej tabeli ? "id jest ważniejsze od klasy" wynika ze specyfikacji w3c, a skrócone 'wytłumaczenie' znajdziesz w pierwszym lepszym kursie css.

kufalo

6.09.2011, 13:33:10

Ok, podejrzewalem ze jeszcze moze byc cos wiecej, czego nie uzywalem do tej pory.

luckyps

6.09.2011, 13:39:56

Jeszcze możesz przypisać style bezpośrednio dla danego znacznika html np:

[HTML] pobierz, plaintext 
<style type="text/css">
 div {opacity:0.5}
 </style>
[HTML] pobierz, plaintext

ActivePlayer

6.09.2011, 14:10:41

jest jeszcze !important

Pawel_W

6.09.2011, 14:30:09

ogólnie im bardziej uszczegółowisz tym większe ma znaczenie, np.

Kod

div .klasa .klasa2

jest mocniejsze niż

Kod

.klasa2

kamil4u

6.09.2011, 16:19:59

CSS to Kaskadowe arkusze stylów. Ważne jest tu słowo kaskada, które Ciebie powinno zainteresować. Jak napisał ~Pawel_W w css ważniejsze są style jak najbardziej szczegółowe. Już na Wikipedii masz, krótką listę:

Cytat

1. Domyślny arkusz przeglądarki WWW (niezależny od autora strony)
2. Domyślny arkusz użytkownika przeglądarki (jak wyżej)
3. Zewnętrzne arkusze stylów i definicje stylów w nagłówku dokumentu
4. Definicje stylów w atrybucie style elementu

Większość sporów, można wziąć na zdrowy rozum. ID(#) jest unikalne, więc jest ważniejsze od klasy(.), które może być nadane wielu elementom, ale klasa jest ważniejsza niż sam element(np. div{ color: red; }). Innym przykładem jest kod podany przez ~Pawel_W. Jeżeli mam taką samą deklarację to wtedy na zdrowy rozum jest ta późniejsza:

[CSS] pobierz, plaintext 
span{ color: red; }
span{ coor: blue; } /* span będzie miał kolor niebieski */
[CSS] pobierz, plaintext

Taka sytuacja jest czasami spotykana przy wielu plikach *.css. Jak ~ActivePlayer już wspomniał !important potrafi "załamać" tę "kaskadość"(choć używa się to rzadko warto, abyś o tym poczytał).

Na koniec poczytaj o specyficzności(choć to trochę naciągane): http://webhosting.pl/Odkrywamy.zaawansowan...ozone.selektory

Najlepiej poćwicz to wpadnie to samo - intuicyjnie

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.