Kā pievienot komentārus kaskādes stila lapām (CSS)

click fraud protection

Katru vietni veido strukturāli, funkcionāli un stilistiski elementi. Kaskādes stila lapas diktē vietnes izskatu ("izskatu un sajūtu"). Šie stili tiek turēti atsevišķi no HTML struktūras, lai atvieglotu tīmekļa standartu atjaunināšanu un ievērošanu.

Stila lapu problēma

Ar daudzu vietņu lielumu un sarežģītību mūsdienās stilu lapas var kļūt diezgan garas un apgrūtinošas. Šī problēma ir kļuvusi sarežģītāka tagad plašsaziņas līdzekļu vaicājumi priekš atsaucīgi vietņu stili ir būtiska dizaina sastāvdaļa, nodrošinot, ka vietne izskatās tā, kā tai vajadzētu izskatīties neatkarīgi no ierīces. Šie plašsaziņas līdzekļu vaicājumi vien CSS dokumentam var pievienot ievērojamu skaitu jaunu stilu, padarot to vēl grūtāku strādāt. Pārvaldot šo sarežģītību, CSS komentāri var kļūt par nenovērtējamu palīdzību vietņu dizaineriem un izstrādātājiem.

Komentāri Pievieno struktūru un skaidrību

Pievienojot komentārus vietnes CSS failiem, šī koda sadaļas tiek sakārtotas lasītājam, kurš pārskata dokumentu. Tas arī nodrošina konsekvenci, kad viens tīmekļa profesionālis sāk darbu tur, kur cits aiziet, vai kad cilvēku grupas strādā vietnē.

instagram viewer

Labi noformēti komentāri par svarīgiem stila lapas aspektiem paziņo komandas locekļiem, kuri, iespējams, nepazīst kodu. Šie komentāri ir noderīgi arī cilvēkiem, kuri iepriekš ir strādājuši vietnē, bet nesen to nav darījuši; tīmekļa dizaineri parasti strādā daudzās vietnēs, un ir grūti atcerēties dizaina stratēģijas no vienas uz otru.

Tikai profesionāļu acīm

CSS komentāri netiek parādīti, kad lapa tiek renderēta tīmekļa pārlūkprogrammas. Šie komentāri ir tikai informatīvi, tāpat kā HTML komentāri ir (kaut arī sintakse ir atšķirīga). Šie CSS komentāri nekādā veidā neietekmē vietnes vizuālo attēlojumu.

CSS komentāru pievienošana

CSS komentāra pievienošana ir diezgan vienkārša. Rezervējiet komentāru ar pareizām sākuma un beigu komentāru atzīmēm:

Sāciet komentāru, pievienojot /* un aizveriet to ar */.

Viss, kas parādās starp šiem diviem tagiem, ir komentāra saturs, kas ir redzams tikai kodā un nav renderēts pārlūkprogrammā.

CSS komentārs var aizņemt jebkuru rindu skaitu. Šeit ir divi piemēri:

/ * sarkanas apmales piemērs * /
div # border_red {
apmale: plāna vienkrāsaina;
}
/***************************
****************************
Stils koda tekstam
****************************
***************************/

Sadaļu izdalīšana

Daudzi dizaineri stila lapas organizē mazos, viegli sagremojamos gabalos, kurus lasīšanas laikā ir viegli ieskenēt. Parasti komentārus redzēs pirms un pēc tam defisi, kas lapā rada lielus, acīmredzamus pārtraukumus, kurus ir viegli redzēt. Šeit ir piemērs:

/ * Galvenes stili * /

Šie komentāri norāda uz jaunas kodēšanas sadaļas sākumu.

Komentēšanas kods

Tā kā komentāru tagi liek pārlūkam ignorēt visu, kas atrodas starp tiem, varat tos izmantot, lai īslaicīgi atspējotu noteiktas CSS koda daļas. Šis triks var būt noderīgs atkļūdošanas laikā vai pielāgojot tīmekļa lapu formatējumu. Patiesībā dizaineri tos bieži izmanto, lai “komentētu” vai “izslēgtu” koda apgabalus, lai redzētu, kas notiek, ja šī sadaļa nav lapas sastāvdaļa.

Pievienojiet sākuma komentāra tagu pirms koda, kuru vēlaties komentēt (atspējot); ievietojiet beigu tagu vietā, kur vēlaties, lai beigtos atspējotā daļa. Nekas starp šiem tagiem neietekmēs vietnes vizuālo attēlojumu, palīdzot atkļūdot CSS, lai redzētu, kur notiek problēma. Pēc tam jūs varat ieiet un novērst tikai šo kļūdu un pēc tam noņemt komentārus no koda.

CSS komentēšanas padomi

Daudzi kodētāji iekļauj komentāru blokus jebkura jauna faila ar kodu augšdaļā. Atdariniet šo stratēģiju, iekļaujot komentāru bloku ar savu vārdu, attiecīgajiem datumiem un saistīto informāciju, lai palīdzētu cilvēki saprot projekta kontekstu un ne tikai lēmumus par to, kas notiek attiecībā pret konkrētu kodu bloķēt.

instagram story viewer