CSS-komennon lisääminen

Kommenttien sisällyttäminen CSS-koodiin on hyödyllistä ja erittäin suositeltavaa.

Jokainen verkkosivusto koostuu rakenteellisista elementeistä (joita sanelee HTML) sekä kyseisen sivuston visuaalisesta tyylistä tai ulkoasusta. CSS-tyylitiedostoja (CSS) käyttävät sitä, miten sanotaan verkkosivuston ulkoasua. Nämä tyylejä pidetään erillään HTML-rakenteesta, jotta verkkosivustot voidaan päivittää ja noudattaa.

Nykyään monien verkkosivustojen monimutkaisuus tyyliarkit voivat nopeasti olla melko pitkä ja erittäin hankala työskennellä. Tämä pätee erityisesti silloin, kun lisäät mediakyselyihin vastaavia verkkosivustojen tyyppejä . Nämä mediakyselyt yksinään voivat lisätä huomattavan määrän uusia tyylejä CSS-dokumenttiin ja tehdä siitä entistä vaikeammalta työskennellä. Tässä CSS-kommentit voivat olla korvaamaton apu verkkosivustolla.

Kommenttien lisääminen verkkosivuston CSS-tiedostoihin on erinomainen tapa lisätä rakennetta kyseisen koodin osiin ihmisen lukijalle, joka tutkii asiakirjaa. Se on myös hieno tapa selittää niitä tyylejä web-ammattilaisille, jotka joutuvat työskentelemään sivustolla tulevaisuudessa - myös itse!

Loppujen lopuksi älykkäästi lisättyjä CSS-kommentteja tekevät tyyliarkin helpommaksi käsitellä. Tämä on todellakin tärkeä tyyliarkeille, joita ryhmät muokkaavat. Huomautuksia voidaan käyttää ilmoittamaan tyyliarkin tärkeät näkökohdat tiimin eri jäsenille, jotka eivät ehkä tunne koodia jo. Nämä kommentit voivat myös olla erittäin hyödyllisiä ihmisille, jotka ovat työskennelleet sivustolla ennen, jos he saavat takaisin koodin poissa siitä jonkin aikaa. Minulla on usein ollut muokata verkkosivuja, jonka rakensin kuukausia tai jopa vuosia sitten ja ottaa hyvin muotoillut kommentit HTML ja CSS on erittäin tervetullut apua! Muista vain, koska olet rakentanut sivuston, ei tarkoita, että muistat, miksi teit asioita, joita teit, kun palaat kyseiseen sivustoon tulevaisuudessa! Huomautukset voivat tehdä aikomuksesi selkeiksi ja selvittää väärinkäsitykset ennen kuin ne tapahtuvat.

Yksi asia, joka on syytä ymmärtää CSS-kommentteja, on se, että niitä ei näytetä, kun sivu on selaimissa. Nämä kommentit ovat vain informaatiota, aivan kuten HTML-kommentit ovat (vaikka syntaksit eroavat toisistaan). Nämä CSS-kommentit eivät millään tavalla vaikuta sivuston visuaaliseen näyttöön, ja ne ovat yksinkertaisesti mukana koodissa itsessään.

CSS-kommenttien lisääminen

CSS-kommentin lisääminen on melko helppoa. Sinä yksinkertaisesti bookend kommenttisi oikeilla avattavilla ja suljetuilla komentotunnisteilla:

Kaikki näiden kahden tunnisteen välissä näkyvä sisältö on kommentin sisältö, joka näkyy vain koodissa eikä selaimessa.

CSS-kommentti voi olla yksi rivi, tai se voi viedä useita rivejä. Tässä on yksi rivin esimerkki:

div # border_red {border: ohut kiinteä punainen; } / * punainen raja esimerkki * /

Ja monilinjainen esimerkki:

/ *************************** ********************** ****** Style-koodin teksti **************************** ************ *************** /

Poistetaan osia

Yksi tavoista, joilla käytän usein CSS-kommentteja, on järjestää tyyliarkkini pienemmissä, helpommin sopimattomissa palasissa. Haluan nähdä nämä osat helposti, kun käsittelen tiedoston myöhemmin. Voit tehdä tämän usein lisäämällä niihin kommentteja, joissa on paljon riviä, jotta ne tarjoavat suuria, ilmeisiä katkoksia sivulle, jotka ovat helposti nähtävissä, kun selata koodia nopeasti. Tässä on esimerkki:

/ * ----------------------- Header Styles ----------------------- ------- * /

Kun näen yhden näistä kommenteista koodini, tiedän, että kyseinen asiakirja on uuden osan alku, joka mahdollistaa koodin käsittelyn ja käytön entistä helpommin.

& # 34; Commenting Out & # 34; Koodi

Kommenttitunnisteet voivat myös olla hyödyllisiä varsinaisessa koodauksen ja virheenkorjausprosessissa. Kommenteja voidaan käyttää "kommentoida" tai "sammuttaa" tämän koodin alueet nähdäksesi, mitä tapahtuu, jos kyseinen osio ei ole osa sivua.

Miten tämä toimii? Koska komentotunnisteet kertovat selaimelle, että ne jättävät huomiotta kaiken niiden väliltä, ​​voit käyttää niitä väliaikaisesti poistamiseen tietyistä CSS-koodin osista. Tämä voi olla kätevää virheen suorittamisen aikana tai Web-sivun muotoilun säätämisen yhteydessä.

Voit tehdä tämän yksinkertaisesti lisäämällä avauskommenttitunnisteen, johon haluat koodin aloittavan sen käytöstä, ja asettamalla sen lopetustunniste, johon haluat estää vammaisen osan lopettamisen. Kaikki näiden tunnisteiden välillä ei vaikuta sivuston visuaaliseen näyttöön, joten voit kaapata CSS: n nähdäksesi missä ongelma voi tapahtua. Voit mennä sisään ja korjata juuri kyseisen ongelman ja poistaa kommentit koodista.

CSS: n kommentointivinkit

Palautteena on tässä muutamia vinkkejä muistiin, kun käytät kommentteja CSS: ään:

  1. Kommentit voivat sisältää useita rivejä.
  2. Kommenteihin voi sisältyä CSS-elementtejä, joita et halua tehdä selaimesta, mutta et halua poistaa niitä kokonaan. Tämä on mukava tapa korjata verkkosivuston tyylitiedostot - muista poistaa käyttämättömät tyylit (toisin kuin jättää ne kommentoituun), jos päätät, että niitä ei tarvitse käyttää verkkosivustossa
  3. Käytä kommentteja aina, kun kirjoitat monimutkaista CSS: ää lisätäksesi selvennyksiä ja ilmoittaaksesi tulevaisuuden kehittäjille tai itsellesi tulevaisuudessa tärkeistä asioista, joita heidän pitäisi tietää. Tämä säästää tulevaa kehitysaikaa kaikille mukana oleville.
  4. Huomautuksiin voi sisältyä myös metatietoja, kuten:
    • kirjailija
    • Päivämäärä luotu
    • tekijänoikeustiedot

Esitys

Huomautukset voivat olla varmasti hyödyllisiä, mutta muista, että lisäät kommentit, joita lisäät tyylitiedostoon, sitä paremmin, mikä tulee vaikuttamaan sivuston latausnopeuteen ja suorituskykyyn. Tämä on todellinen huolenaihe, mutta sinun ei pidä epäröidä lisätä hyödyllisiä ja oikeutettuja kommentteja pelkäämään, että suorituskyky kärsii. CSS: n rivit eivät lisää huomattavia kokoja asiakirjaan. Sinun tulee lisätä TONS kommentteja, jotta se vaikuttaisi merkittävästi CSS-tiedoston kokoon. Käsittele muutamia hyödyllisiä kommentteja CSS: äänsi ei saisi antaa kielteisiä vaikutuksia sivunopeuteen.

Lopuksi halutaan löytää tasapaino hyödyllisten kommenttien ja liian monien kommenttien välillä saadaksesi etuja sekä CSS-asiakirjoissasi.

Alkuperäinen artikkeli Jennifer Krynin. Julkaisija Jeremy Girard 7/5/17