Minden weboldal strukturális, funkcionális és stílusbeli elemekből áll. Lépcsőzetes stíluslapok diktálja a weboldal megjelenését (a "kinézetet és érzést"). Ezeket a stílusokat külön tartják el a HTML struktúrától, hogy megkönnyítsék a frissítést és a webes szabványok betartását.
A probléma a stíluslapokkal
Számos weboldal méretével és összetettségével napjainkban a stíluslapok meglehetősen hosszadalmassá és nehézkessé válhatnak. Ez a probléma egyre összetettebbé vált média lekérdezések mert érzékeny webhelystílusok elengedhetetlen részét képezik a tervezésnek, biztosítva, hogy egy weboldal eszközétől függetlenül úgy nézzen ki, ahogy annak kellene. Ezek a médiakérdések önmagukban jelentős számú új stílust adhatnak a CSS-dokumentumhoz, ami még nehezebbé teszi a munkát. Ennek a bonyolultságnak a kezelése az, ahol a CSS-megjegyzések felbecsülhetetlen segítséget nyújthatnak a weboldal-tervezők és fejlesztők számára.
Megjegyzések Struktúra és egyértelműség hozzáadása
Megjegyzések hozzáadása egy webhely CSS-fájljaihoz a kód részeit rendezi egy olyan emberi olvasó számára, aki áttekinti a dokumentumot. Biztosítja a következetességet is, amikor az egyik internetes szakember ott folytatja, ahol a másik távozik, vagy amikor embercsoportok dolgoznak egy webhelyen.
A jól formázott megjegyzések a stíluslap fontos szempontjait közlik a csapat tagjaival, akik nem ismerik a kódot. Ezek a megjegyzések azok számára is hasznosak, akik korábban dolgoztak a webhelyen, de nemrégiben még nem; A webdizájnerek általában sok webhelyen dolgoznak, és nehéz a tervezési stratégiákra való emlékezés.
Csak a szakemberek számára
A CSS-megjegyzések nem jelennek meg, amikor az oldal megjelenik webböngészők. Ezek a megjegyzések csak tájékoztató jellegűek, csakúgy, mint HTML megjegyzések vannak (bár a szintaxis más). Ezek a CSS megjegyzések semmilyen módon nem befolyásolják a webhely vizuális megjelenítését.
CSS-megjegyzések hozzáadása
CSS megjegyzés hozzáadása meglehetősen egyszerű. Tegye megjegyzéséhez a megfelelő kezdő és záró megjegyzést:
Kezdje megjegyzését hozzáadással /* és bezárja azzal */.
Bármi, ami a két címke között megjelenik, a megjegyzés tartalma, csak a kódban látható és a böngésző által nem.
A CSS megjegyzés tetszőleges számú sort foglalhat el. Íme két példa:
/ * piros szegély példa * /
div # border_red {
szegély: vékony egyszínű vörös;
}
/***************************
****************************
Stílus a kódszöveghez
****************************
***************************/
Szakaszok kibontása
Sok tervező apró, könnyen emészthető darabokban rendezi a stíluslapokat, amelyeket olvasás közben könnyen be lehet szkennelni. Általában a megjegyzéseket kötőjelek előzik meg és követik, amelyek nagy, nyilvánvaló töréseket hoznak létre az oldalon, amelyek könnyen láthatók. Íme egy példa:
/ * Fejlécstílusok * /
Ezek a megjegyzések a kódolás új szakaszának kezdetét jelzik.
Megjegyzéskód
Mivel a megjegyzéscímkék arra szólítják fel a böngészőt, hogy figyelmen kívül hagyjon mindent, ami köztük van, használhatja őket a CSS-kód bizonyos részeinek ideiglenes letiltására. Ez a trükk hasznos lehet hibakeresés közben, vagy a weboldal formázásának beállításakor. Valójában a tervezők gyakran használják őket a kódterületek "kommentelésére" vagy "kikapcsolására", hogy megnézzék, mi történik, ha ez a szakasz nem része az oldalnak.
Adja hozzá a nyitó megjegyzés címkét a kommentálandó kód elé (letiltja); helyezze a zárótagot oda, ahol a letiltott részt be akarja fejezni. A címkék között semmi sem befolyásolja a webhely vizuális megjelenítését, ami segít a CSS hibakeresésében, hogy lássa, hol történik egy probléma. Ezután bemehet és kijavíthatja ezt a hibát, majd eltávolíthatja a megjegyzéseket a kódból.
CSS-hozzászólási tippek
Sok kódoló kommentkockákat tartalmaz minden új, kódos fájl tetején. Utánozza ezt a stratégiát úgy, hogy a megjegyzés blokkját tartalmazza a nevével, a releváns dátumokkal és a kapcsolódó információkkal az emberek megértik a projekt kontextusát, és nem csak a konkrét kóddal kapcsolatos történésekről döntenek Blokk.