Kaip įterpti CSS komentarą

Įtraukti komentarus į savo CSS kodą yra naudinga ir labai rekomenduojama.

Kiekviena svetainė susideda iš struktūrinių elementų (kuriuos diktuoja HTML), taip pat vizualinį stilių arba "išvaizdą ir jausmą" toje svetainėje. Kaskadinio stiliaus lapai (CSS) yra tai, kas naudojama diktuoti svetainės išvaizdą. Šie stiliai yra atskirti nuo HTML struktūros, kad būtų lengviau atnaujinti ir laikytis interneto standartų.

Dėl šiandien daugelio svetainių sudėtingumo dydžio stiliaus lapai gali greitai tapti gana ilgai ir labai sudėtingi dirbti. Tai ypač aktualu, kai pradedate pridėti žiniasklaidos užklausas jautriems svetainės stiliams . Vien tik tų žiniasklaidos užklausų CSS dokumente galima pridėti daug naujų stilių ir dar sunkiau dirbti. Čia CSS komentarai gali tapti neįkainojama pagalba svetainėje.

Komentarų pridėjimas į svetainės CSS rinkmenas yra puikus būdas pridėti struktūrą prie šio kodo skirsnių žmonėms skaitytojams, kurie peržiūri dokumentą. Tai taip pat puikus būdas paaiškinti tuos stilius žiniatinklio profesionalams, kurie gali dirbti šioje svetainėje ateityje, įskaitant save!

Galų gale, protingai pridėjus CSS komentarus bus lengviau apdoroti stilių lentelę. Tai iš tikrųjų svarbu stilių lenteles, kurias redaguoja komandos. Komentarai gali būti naudojami svarbiems stiliaus elementams perduoti skirtingiems komandos nariams, kurie jau gali būti susipažinę su kodu. Šios pastabos taip pat gali būti labai naudingos žmonėms, kurie anksčiau dirbo svetainėje, jei jie sugrįžta į kodą, kai tam tikru metu yra toli nuo jo. Dažnai turėjau redaguoti svetainę, kurią sukūriau prieš mėnesius ar net prieš metus, o HTML ir CSS formatas gerai komentuoja, yra labai sveikintina! Atminkite, kad dėl to, kad sukūrėte svetainę, nereikės prisiminti, kodėl atlikote veiksmus, kuriuos atlikote, kai ateityje grįšite į šią svetainę! Pastabos gali aiškiai išdėstyti savo ketinimus ir išspręsti bet kokius nesusipratimus, kol jie net atsitiks.

Vienas dalykas suprasti CSS pastabas yra tai, kad jie nerodomi, kai puslapis pateikia žiniatinklio naršyklėse. Šie komentarai yra tik informaciniai, kaip ir HTML komentarai (nors sintaksė skiriasi tarp dviejų). Šie CSS komentarai jokiu būdu neturi įtakos vizualiai rodyti svetainę ir yra tiesiog pateikiami pačiame kodekse.

CSS komentarų pridėjimas

CSS komentaro pridėjimas yra gana lengvas. Jūs tiesiog užsisakote savo komentarą su teisingomis atidarymo ir uždarymo komentarų žymėmis:

Viskas, kas atsiranda tarp šių dviejų žymių, bus komentaro turinys, matomas tik kodu ir nebus rodomas naršyklėje.

CSS komentaras gali būti viena eilutė arba ji gali užtrukti kelias eilutes. Štai vieno eilutės pavyzdys:

div # border_red (rėmelis: plonas kietas raudonas; } / * raudonas rėmelis pavyzdys * /

Ir daugybinis pavyzdys:

/ *************************** ********************** ****** Stilius kodo tekstui **************************** ************ *************** /

Ištraukimo sekcijos

Vienas iš būdų, kodėl dažnai naudoju CSS komentarus, - tai tvarkyti mano stiliaus lapą mažesniais, lengviau nuskaitymo būdais. Man patinka, kad galėčiau lengvai peržiūrėti šiuos skirsnius, kai vėliau sužinosiu failą. Norėdami tai padaryti, aš dažnai įtraukiu į juos komentarus su daugybe brūkšnelių, kad jie pateiktų didelius, akivaizdžius puslapio plyšius, kuriuos lengva pamatyti, nes aš greitai peržvelgiu kodą. Štai pavyzdys:

/ * ----------------------- antraščių stilius ----------------------- ------- * /

Kai mano kodą žiūriu vieną iš šių komentarų, žinau, kad tai yra naujo šio dokumento skyriaus pradžia, leidžianti man lengviau apdoroti ir naudoti kodą.

Komentuodamas & # 34; Kodas

Komentarų žymos taip pat gali būti naudingos tikrame puslapio kodavimo ir derinimo procese. Komentarai gali būti naudojami norint "komentuoti" arba "išjungti" šio kodo sričių, kad būtų galima pamatyti, kas atsitiks, jei šis skyrius nėra puslapio dalis.

Taigi, kaip tai veikia? Na, nes komentarų žymos nurodo naršyklei ignoruoti viską tarp jų, jas galite naudoti, kad laikinai išjungtumėte tam tikras CSS kodo dalis. Tai gali būti naudinga derinant arba koreguojant tinklalapio formatavimą.

Norėdami tai padaryti, paprasčiausiai pridėkite atidarymo komentaro žymę, kurioje norite, kad kodas būtų išjungtas, o tada pridėkite tą baigiamąją žymę, kurioje norite, kad išjungta dalis baigtųsi. Viskas tarp šių žymių neturi įtakos vizualiai rodyti svetainę, todėl galite išvalyti CSS, kad pamatytumėte, kur gali kilti problema. Tada galite įeiti ir išspręsti šią problemą ir pašalinti komentarus iš kodo.

CSS komentarų patarimai

Kaip santrauką, čia yra keletas patarimų, kaip prisiminti, kaip naudoti komentarus savo CSS:

  1. Komentarai gali apimti kelias eilutes.
  2. Komentarai gali apimti CSS elementus, kuriuos nenorite pateikti naršykle, bet nenorite visiškai ištrinti. Tai puikus būdas derinti svetainės stiliaus lapus - tiesiog būtinai pašalinkite nepanaudotus stilius (o ne palikdami juos komentuotus), jei nuspręsite, kad jų nereikia svetainėje.
  3. Pasinaudokite pastabomis, kai rašote sudėtingą CSS, kad pridėtumėte paaiškinimų, ir ateities kūrėjams ar sau ateityje informuotumėte apie svarbius dalykus, kuriuos jie turėtų žinoti. Tai leis sutaupyti tolesnio plėtros laiko visiems dalyviams.
  4. Pastabose taip pat gali būti tokios meta informacijos kaip:
    • autorius
    • Sukūrimo data
    • autorių teisių informacija

Spektaklis

Komentarai tikrai gali būti naudingi, tačiau turėtumėte žinoti, kad daugiau komentarų pridedate prie stiliaus lapo, o jis taps geresniu, o tai turės įtakos svetainės atsisiuntimo greičiui ir našumui. Tai yra tikras susirūpinimas, tačiau neturėtumėte dėti jokių naudingų ir teisėtų pastabų dėl baimės, kad jos patirs. CSS eilutės neprideda prie dokumento didelės apimties. Turėtumėte pridėti TONS komentarų eilučių, kad padarytumėte reikšmingą įtaką CSS failo dydžiui. Pridėjus keletą naudingų komentarų į savo CSS neturėtų būti daromas neigiamas poveikis puslapio greičiui.

Galų gale, jūs norėsite rasti pusiausvyrą tarp naudingų komentarų ir per daug komentarų, kad gautumėte naudos tiek savo CSS dokumentuose.

Originalus straipsnis Jennifer Krynin. Redagavo Jeremy Girard 7/5/17