Comment Ajouter et Utiliser des Commentaires CSS
Chaque site web se compose d'éléments qui sont structurels, fonctionnel et stylistique. Les feuilles de style en cascade (Cascading Style Sheets (CSS)) sont utilisées pour définir l'apparence du site web ("look and feel"). Tant stylles sont traités séparément de la structure HTML afin que les standardes web puissent être facilement mis à jour et appliqués à.
Le problème avec les feuilles de style est que celles-ci peuvent devenir longues et compiquées avec la taille et la complexibilité de quelques pages web à nos jours. Cela est particulièrement vrai maintenant que les demandes média font une partie importante de la conception pour les styles web dynamiques, en aidant à garantir qu'un site Web a l’air qu’il pourrait être quel que soit l’appareil.
Ces demandes media seules peuvent proposer un nombre significatif de nouveaux styles à un document CSS, en faisant le travail avec aux même plus difficile. C'est ici où les commentaires CSS peuvent être un aide essentiel pour les dessinateurs web et les développeur.
Pour donner une information explicative au code ou pour empêcher le navigateur d'essayer à interpréter les parties particulières de la feuille de style, on utilise un commentaire CSS. Les commentaires par conception n'ont vraimenet aucun impact sur le gabarit d'un document. Les commentaires ne peuvent pas être affichés, car les navigateurs les ignorent.
Au même temps, l'utilisation des commentaires comme écrire un code CSS est utile pour celui qui écrit le code et pour tout le monde qui font un recherche du code. Les commentaires sont utilisés pour expliquer les fonctions potentiellement déroutantes, pour empêcher les blocs du code d'être tournés, et pour créer une documentation pour les capabilités et la signification du code. On n'a pas besoin de commenter chaque morceau du code que vous écrivez, cependant commenter précisément peut être très utile.
Les commentaires peuvent être placés où que l'espace blanc soit permis dans une feuille de style. Ils peuvent être utilisés sur une seule ligne, ou traverser les lignes multiples.
Commencez votre commentaire en ajoutant un /* et terminez votre commentaire en ajoutant */.
La syntaxe est comme cela:
/* comment */
Cette syntaxe est utilisée pour les commentaires seuls et multi-lignes à la fois. Maintenant voyons un exemple dans lequel on a utilisés des commentaires.
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Titre du document</title>
<style>
p {
line-height: 2em; /*1em = 16px */
}
</style>
</head>
<body>
<p>Quelque paragraphe.</p>
<p>Ce paragraphe est écrit en 2em line-height.</p>
</body>
</html>
Les commentaires mis en forme correctement peuvent décrire les aspects importants de la feuille de style aux participants d'un société qui ne connaissait pas le code auparavant. Ces commentaires sont aussi très importants pour les gens qui ont travaillé sur le site web auparavant , de toute façon, ils n'ont pas travaillé récemment; les dessinateurs web travaillent souvent sur des sites différents, et se souvenir les téchniques de conception pour chacun n'est pas une tâche facile.
Beaucoup de dessinateurs séparent les séctions et coordonnent les feuilles de style en petits morceaux compréhensibles facilement qui peuvent être enquêtés lors de la lecture. Vous allez voir les commentaires précédés et suivis par une série des signes de ponctuation qui créent des séctions massives et claires sur la page pour les rendre faciles à voir. Voici un exemple de cela:
Exemple
/***************************
****************************
C'est un style pour l'arrière-plan.
****************************
***************************/
Ou cela peut être comme ça:
Exemple
/*---------------------- Styles de l'arrière-plans ------------------------*/
Bien que l'ajout de trop de commentaires puisse affecter la vitesse de téléchargement et les performances réelles d'un site Web, vous ne devez pas hésiter à les appliquer. Un impact médiocre massif prendrait de nombreuses lignes de commentaires. Tout se résume à l'équilibre, comme de nombreuses parties de la structure Web.