CSS hozzászólás beillesztése

Beleértve a megjegyzéseket a CSS kódjában hasznos és rendkívül ajánlott.

Minden weboldal strukturális elemekből áll (amelyeket a HTML diktál), valamint a webhely vizuális stílusát vagy "megjelenését". A CSS (Cascading Style Sheets) (Cascading Style Sheets) a weboldal vizuális megjelenésének diktálására szolgál. Ezek a stílusok elkülönülnek a HTML-struktúrától, hogy megkönnyítsék a webes szabványok frissítését és betartását.

Számos weboldal bonyolultsága miatt a stíluslapok gyorsan elhúzódhatnak és nagyon nehézkesek a munkához. Ez különösen akkor igaz, ha elkezdi hozzáadni a médiabérleteket a válaszoló webhelyek stílusaihoz . Ezek a média lekérdezések önmagukban jelentős mennyiségű új stílust vehetnek fel egy CSS dokumentumba, és még nehezebbé válnak együtt dolgozni. Ez az, ahol a CSS-megjegyzések felbecsülhetetlen segítséget nyújthatnak egy webhelyen.

Megjegyzések hozzáadása a weboldal CSS-fájlaihoz nagyszerű módja annak, hogy az emberi kódolvasó részeit hozzá lehessen venni a dokumentum felülvizsgálatához. Ez egy csodálatos módja annak, hogy megmagyarázza azokat a stílusokat egy webszakember számára, akiknek a jövőben is foglalkozniuk kell a webhelyen - beleértve magát is!

Végül a CSS megjegyzései finoman hozzáadva a stíluslapot könnyebben feldolgozhatják. Ez valóban fontos a stíluslapok szerkesztésénél. A megjegyzések felhasználhatók a stíluslap fontos szempontjainak a csapat különböző tagjai számára történő kommunikációjára, akik már nem ismerik a kódot. Ezek az észrevételek nagyon hasznosak lehetnek azok számára is, akik korábban a webhelyen dolgozták őket, ha egy idő után távol tartják a kódot. Gyakran szerkesztettem egy hónapot vagy akár évekkel ezelőtt épített honlapot, és jól formázott megjegyzéseket tettek a HTML-ben és a CSS-ben. Ne feledd, csak azért, mert építettél egy webhelyet, nem azt jelenti, hogy emlékezni fogsz arra, miért tetted a dolgokat, amikor a jövőben visszatérsz erre a webhelyre? A megjegyzések egyértelművé tehetik szándékait és tisztázhatják a félreértéseket, mielőtt még megtörténnének.

A CSS-megjegyzések egyikét meg kell érteni, hogy nem jelenik meg, amikor az oldal megjelenik a webböngészőkben. Ezek a megjegyzések csak tájékoztató jellegűek, csakúgy, mint a HTML megjegyzések (bár a szintaxis eltér a kettő között). Ezek a CSS megjegyzések semmilyen módon nem befolyásolják a webhely vizuális megjelenítését, és egyszerűen csak a kódban vannak jelen.

CSS megjegyzések hozzáadása

A CSS megjegyzés hozzáadásával elég egyszerű. Egyszerűen bookend a megjegyzést a helyes nyitó és záró megjegyzés tagek:

Bármi, ami e két címke között megjelenik, a megjegyzés tartalmát fogja tartalmazni, amely csak a kódban látható, és nem a böngésző által.

A CSS megjegyzés egy sor lehet, vagy több sorba is beletartozhat. Íme egy sor példa:

div # border_red {border: vékony, szilárd vörös; } / * piros határ szegmens * /

És egy többsoros példa:

/ *************************** ********************** ****** A kód szövegének stílusa **************************** ************ *************** /

Breaking Out szakaszok

Az egyik módja annak, hogy gyakran használom a CSS megjegyzéseket, hogy a stíluslapomat kisebb, könnyebben felismerhető részekké szervezzem. Szeretem, hogy könnyebben láthassam ezeket a részeket, amikor később kitalálom a fájlt. Ehhez gyakran megjegyzéseket és sok kötőjelet adok hozzá, hogy azok nagy, nyilvánvaló szünetekkel rendelkezzenek az oldalon, amelyeket könnyű látni, ahogy gyorsan megkerülem a kódot. Íme egy példa:

/ * ----------------------- Fejléc stílusok ----------------------- ------- * /

Amikor meglátom az egyik ilyen megjegyzést a kódomban, tudom, hogy ez a dokumentum egy új szakaszának kezdete, amely lehetővé teszi számomra a kód egyszerűbb feldolgozását és használatát.

& # 34; Commenting Out & # 34; Kód

A megjegyzéscímkék hasznosak lehetnek az oldal kódolásának és hibakeresésének folyamatában is. A megjegyzések felhasználhatók arra, hogy "kijavítsák" vagy "kikapcsolják" a kódok területét, hogy megnézzék, mi történik, ha ez a rész nem része az oldalnak.

Tehát hogyan működik ez? Nos, mivel a megjegyzés-címkék azt mondják a böngészőnek, hogy figyelmen kívül hagyjon mindent közöttük, használhatja őket a CSS-kód bizonyos részeinek ideiglenes letiltására. Ez hasznos lehet a hibakeresésnél vagy a weblap formázásakor.

Ehhez egyszerűen hozzá kell adnia a megnyitási megjegyzéscímkét, ahová a kódot el szeretné kezdeni, és helyezze azt a végződő címkét, ahová a letiltott rész véget ér. Mindezek a címkék nem befolyásolják a webhely vizuális megjelenítését, így a CSS hibakeresése révén megnézheti, hol lehet a probléma. Ezután bejöhet és rögzítheti ezt a problémát, és eltávolíthatja a megjegyzéseket a kódból.

CSS kommentáló tippek

Újratöltésként itt néhány tipp, amelyre a CSS-ben szereplő megjegyzések használatára emlékeznék:

  1. A megjegyzések több sort is tartalmazhatnak.
  2. A megjegyzések tartalmazhatnak olyan CSS-elemeket, amelyeket nem szeretne a böngésző által létrehozni, de nem szeretné teljesen törölni őket. Ez egy jó módja a weblap stíluslapainak hibakereséséhez - csak akkor szabad eltávolítani a fel nem használt stílusokat (ellentétben azzal, hogy észrevétlenül hagyja őket), ha úgy dönt, hogy nem kell őket a weboldalon
  3. Ha komplikált CSS-t írsz, írj meg észrevételeket, hogy pontosításokat adjon, és tájékoztassa a jövőbeli fejlesztőket, vagy a jövőben azokat a fontos dolgokat, amelyeket tudnia kell. Ez a jövőbeni fejlesztési időt minden résztvevő számára meg fogja menteni.
  4. A megjegyzések tartalmazhatnak olyan meta információkat is, mint például:
    • szerző
    • dátum létrehozva
    • szerzői jogi információk

Teljesítmény

A megjegyzések biztosan hasznosak lehetnek, de vegye figyelembe, hogy minél több megjegyzést ad hozzá egy stíluslaphoz, a heftier lesz, ami hatással lesz a webhely letöltési sebességére és teljesítményére. Ez valóban aggodalomra ad okot, de ne habozzon hozzáadni hasznos és törvényes megjegyzéseket attól tartva, hogy a teljesítmény szenved. A CSS sorai nem tartalmaznak jelentős méretű dokumentumokat. TONS kommenteket kell hozzáadnia ahhoz, hogy jelentős hatással legyen a CSS-fájl méretére. Néhány hasznos megjegyzés hozzáadása a CSS-hez nem szabadna nettó negatív hatással az oldal sebességére.

Végül szeretnénk megtalálni az egyensúlyt a hasznos megjegyzések és a túl sok megjegyzés között, hogy mind a CSS-dokumentumok előnyeit megkapja.

Jennifer Krynin eredeti cikke. Szerkesztette Jeremy Girard a 7/5/17