komentarze są używane w CSS do wyjaśnienia bloku kodu lub do wprowadzania tymczasowych zmian podczas tworzenia. Komentowany kod nie jest wykonywany.
komentarze jedno-i Wielowierszowe w CSS zaczynają się od/* I kończą się na */ I możesz dodać tyle komentarzy do swojego arkusza stylów, ile chcesz. Na przykład:
/* This is a single line comment*/.group:after { content: ""; display: table; clear: both;}/* This is a multi-line comment*/Możesz również uczynić swoje komentarze bardziej czytelnymi, stylizując Je:
w większych projektach pliki CSS mogą szybko rosnąć i stać się trudne do utrzymania., Pomocne może być uporządkowanie CSS w osobne sekcje z spisem treści, aby ułatwić znalezienie pewnych reguł w przyszłości:
trochę więcej o CSS: składnia CSS i selektory
Kiedy mówimy o składni CSS, mówimy o tym, jak rzeczy są ułożone. Istnieją zasady dotyczące tego, co idzie gdzie, zarówno dzięki czemu można pisać CSS konsekwentnie, jak i program (taki jak przeglądarka) może go zinterpretować i poprawnie zastosować do strony.
istnieją dwa główne sposoby pisania CSS.,
Inline CSS
specyfika CSS: sztuczki CSS
inline CSS stosuje styl do pojedynczego elementu i jego potomków, dopóki nie zostanie napotkany inny styl nadpisujący pierwszy.
aby zastosować inline CSS, Dodaj atrybut „style” do elementu HTML, który chcesz zmodyfikować. Wewnątrz cudzysłowów znajduje się rozdzielona średnikiem lista par klucz / wartość (każda z kolei oddzielona dwukropkiem) wskazująca style do Ustawienia.
oto przykład inline CSS. Słowa „Jeden” i ” dwa ” będą miały kolor tła żółty i kolor tekstu czerwony., Słowo „Trzy” ma nowy styl, który zastępuje pierwszy i będzie miał kolor tła zielony i kolor tekstu cyjanowego. W tym przykładzie stosujemy style do znaczników <div>, ale możesz zastosować styl do dowolnego elementu HTML.
<div style="color:red; background:yellow"> One <div> Two </div> <div style="color:cyan; background:green"> Three </div></div>wewnętrzny CSS
podczas pisania stylu inline to szybki sposób na zmianę pojedynczego elementu, istnieje bardziej efektywny sposób na zastosowanie tego samego stylu do wielu elementów strony jednocześnie.,
wewnętrzny CSS ma swoje style określone w znaczniku <style> I jest osadzony w znaczniku <head>.
oto przykład, który ma podobny efekt jak powyższy przykład „inline”, z wyjątkiem tego, że CSS został wyodrębniony do własnego obszaru. Słowa „Jeden” i ” dwa „będą pasowały do selektora div I będą czerwone na żółtym tle., Słowa „trzy” i „cztery” pasują również do selektoradiv, ale pasują również do selektora .nested_div, który odnosi się do dowolnego elementu HTML odwołującego się do tej klasy. Ten bardziej konkretny selektor zastępuje pierwszy, a w końcu pojawia się jako cyjanowy tekst na zielonym tle.
pokazane powyżej selektory są niezwykle proste, ale mogą być dość złożone. Na przykład możliwe jest stosowanie stylów tylko do elementów zagnieżdżonych; to znaczy elementu, który jest potomkiem innego elementu.,
oto przykład, w którym określamy styl, który powinien być stosowany tylko do divelementów, które są bezpośrednim potomkiem innych div elementów. W rezultacie „dwa” i „trzy” pojawią się jako czerwony tekst na żółtym tle, ale „jeden” i „cztery” pozostaną nienaruszone (i najprawdopodobniej czarny tekst na białym tle).
<style type="text/css"> div > div { color: red; background: yellow; }</style><div> One <div> Two </div> <div> Three </div></div><div> Four</div>zewnętrzny CSS
wszystkie stylizacje mają swój własny dokument, który jest połączony tagiem<head>. Rozszerzenie połączonego pliku to .css