Com afegir comentaris a fulls d'estil en cascada (CSS)

Cada lloc web està format per elements estructurals (que són dictats per HTML), funcionals i estilístics. Les fulles d'estil en cascada (CSS) s'utilitzen per dictar l'aparença (el "look and feel") d'un lloc web. Aquests estils es mantenen separats de l'estructura HTML per permetre la fàcil actualització i compliment dels estàndards web.

El problema amb fulls d'estil

Amb la mida i la complexitat de molts llocs web actuals, els fulls d'estil poden arribar a ser bastant llargs i engorats. Això és especialment cert ara que les consultes dels mitjans per als estils de llocs web responsables són una part essencial del disseny, cosa que garanteix que un lloc web s'assembla, independentment del dispositiu. Les consultes per mitjans sols poden afegir un nombre significatiu d'estils nous a un document CSS, fent-lo encara més difícil de treballar. Aquí és on els comentaris de CSS poden convertir-se en una ajuda inestimable als dissenyadors i desenvolupadors de llocs web.

Comentaris Afegeix estructura i claredat

Afegir comentaris als fitxers CSS d'un lloc web és una bona manera d'organitzar seccions d'aquest codi per a un lector humà que està revisant el document. També garanteix la coherència quan un professional web reprèn on un altre s'apaga, o quan els equips de persones treballen en un lloc.

Els comentaris ben formatats poden comunicar aspectes importants del full d'estils als membres d'un equip que potser no estigui familiaritzat amb el codi. Aquests comentaris també són molt útils per a les persones que han treballat al lloc abans, però que no han estat recentment; Els dissenyadors web solen treballar en molts llocs, i recordar les estratègies de disseny d'una a la següent és difícil.

Només per als ulls dels professionals

Els comentaris CSS no es mostren quan la pàgina es fa en navegadors web. Aquests comentaris són només informatius, com ho són els comentaris HTML (tot i que la sintaxi és diferent). Aquests comentaris CSS no afecten de cap manera la visualització visual d'un lloc.

Afegir comentaris CSS

Afegir un comentari CSS és bastant fàcil. Simplement envieu el vostre comentari amb les etiquetes de comentaris i obertura correctes:

• Comenceu el vostre comentari afegint

  /*

• Tanca el comentari afegint

  */

Qualsevol cosa que aparegui entre aquestes dues etiquetes és el contingut del comentari, visible només al codi i no representat pel navegador.

Un comentari CSS pot ocupar qualsevol nombre de línies. Aquests són dos exemples:

/ * exemple de vora vermella * / div # border_red { frontera: primes sòlides vermelles; }/*******************************************************Estil per al text del codi*******************************************************/

Sortint seccions

Molts dissenyadors organitzen fulls d'estil en trossos petits i fàcilment digeribles que són fàcils d'escanejar durant la lectura. Normalment, veureu els comentaris precedits i seguit per una sèrie de guions que creen grans pauses obertes a la pàgina que són fàcils de veure. Aquí teniu un exemple:

/ * ----------------------- Estils de capçalera ----------------------- ------- * /

Aquests comentaris indiquen l'inici d'una nova secció de codificació.

Codi de "Comentari"

Com que les etiquetes de comentari indiquen que el navegador ignora tot el que hi ha entre ells, podeu utilitzar-les per desactivar temporalment determinades parts del codi CSS. Això pot ser útil quan es depura, o quan s'ajusta el format de la pàgina web. De fet, els dissenyadors sovint els utilitzen per "comentar" o "apagar" àrees de codi per veure què passa si aquesta secció no forma part de la pàgina.

Per fer-ho, només cal que afegiu l'etiqueta d'obertura abans del codi que voleu comentar (desactivar); col·loqueu l'etiqueta de tancament on voleu que finalitzi la part desactivada. Res entre aquestes etiquetes afectarà la visualització visual d'un lloc, cosa que us permetrà depurar el CSS per veure on està succeint un problema. A continuació, podeu entrar i solucionar el problema i eliminar els comentaris del codi.

Consells de comentaris CSS

Com a resum, heus aquí alguns consells per recordar per usar comentaris al vostre CSS:

1. Els comentaris poden abastar diverses línies.
2. Els comentaris poden incloure elements CSS que no vulgueu que es renderitzi un navegador, però que no voleu suprimir completament. Recordeu eliminar els estils no utilitzats (a diferència de deixar-los comentats) si decidiu que no els necessiteu al lloc web.
3. Utilitzeu comentaris sempre que escrigui CSS complicat per afegir estructura, aclarir les decisions de disseny i informar els desenvolupadors futurs (o recordar-vos) sobre consideracions importants. Això estalvia temps en el futur per a tots els implicats.
4. Els comentaris també poden incloure informació meta com ara:
   1. Autor
   2. Data de creació
   3. Drets d'autor

Rendiment

Si afegiu massa comentaris pot afectar la velocitat de baixada i el rendiment d'un lloc, no dubti a utilitzar-los. Seria necessari que moltes línies de comentaris tinguessin un impacte negatiu significatiu. Com tants aspectes del disseny web, tot es redueix a l'equilibri.