Varje webbplats består av strukturella, funktionella och stilistiska element. Cascading Style Sheets diktera utseendet ("utseendet") på en webbplats. Dessa stilar hålls åtskilda från HTML-strukturen för att göra det enkelt att uppdatera och följa webbstandarder.
Problemet med stilark
Med storleken och komplexiteten hos många webbplatser idag kan stilark bli ganska långa och besvärliga. Detta problem har ökat i komplexitet nu mediefrågor för responsiva webbplatsstilar är en viktig del av designen och ser till att en webbplats ser ut som den ska oavsett enhet. Dessa mediefrågor ensamma kan lägga till ett betydande antal nya stilar till ett CSS-dokument, vilket gör det ännu svårare att arbeta med. Att hantera denna komplexitet är där CSS-kommentarer kan bli en ovärderlig hjälp för webbdesigners och utvecklare.
Kommentarer Lägg till struktur och tydlighet
Att lägga till kommentarer till en webbplats CSS-filer organiserar delar av koden för en mänsklig läsare som granskar dokumentet. Det säkerställer också konsekvens när en webbproffs tar upp var en annan slutar, eller när team av människor arbetar på en webbplats.
Välformaterade kommentarer kommunicerar viktiga aspekter av stilarket till medlemmar i ett team som kanske inte känner till koden. Dessa kommentarer är också användbara för personer som har arbetat på webbplatsen tidigare men inte nyligen; webbdesigners arbetar vanligtvis på många webbplatser och att komma ihåg designstrategier från en till en annan är svår.
Endast för professionella ögon
CSS-kommentarer visas inte när sidan återges webbläsare. Dessa kommentarer är endast informativa, precis som HTML-kommentarer är (även om syntaxen är annorlunda). Dessa CSS-kommentarer påverkar inte den visuella visningen av en webbplats på något sätt.
Lägga till CSS-kommentarer
Det är ganska enkelt att lägga till en CSS-kommentar. Boka din kommentar med rätt inledande och avslutande kommentarstaggar:
Börja din kommentar med att lägga till /* och stäng den med */.
Allt som visas mellan dessa två taggar är innehållet i kommentaren, syns bara i koden och återges inte av webbläsaren.
En CSS-kommentar kan ta upp valfritt antal rader. Här är två exempel:
/ * exempel på röd kant * /
div # border_red {
kant: tunn fast röd;
}
/***************************
****************************
Stil för kodtext
****************************
***************************/
Bryta ut avsnitt
Många designers organiserar stilark i små, lättsmälta bitar som är lätta att skanna när de läser. Vanligtvis ser du kommentarer som föregås och följs av bindestreck som skapar stora, uppenbara raster på sidan som är lätta att se. Här är ett exempel:
/ * Rubrikstilar * /
Dessa kommentarer indikerar början på en ny kodningsdel.
Kommentar kod
Eftersom kommentarstaggarna säger till webbläsaren att ignorera allt mellan dem kan du använda dem för att tillfälligt inaktivera vissa delar av CSS-koden. Det här tricket kan vara praktiskt när du felsöker eller när du justerar webbsidans formatering. I själva verket använder designers ofta dem för att "kommentera" eller "stänga av" kodområden för att se vad som händer om det avsnittet inte är en del av sidan.
Lägg till inledande kommentarstaggen före koden du vill kommentera (inaktivera); placera stängningstaggen där du vill att den inaktiverade delen ska sluta. Ingenting mellan dessa taggar påverkar den visuella visningen av en webbplats, vilket hjälper dig att felsöka CSS för att se var ett problem händer. Du kan sedan gå in och fixa just den felet och sedan ta bort kommentarerna från koden.
Tips om CSS-kommentarer
Många kodare inkluderar kommentarblock högst upp i en ny fil med kod. Efterlikna den strategin genom att inkludera ett kommentarblock med ditt namn, relevanta datum och relaterad information som hjälp människor förstår sammanhanget för ett projekt och inte bara beslut om vad som sker i förhållande till en specifik kod blockera.