HTML & CSS

CSS – Inclusion


Il existe quatre façons d’associer des styles à votre document HTML. Les méthodes les plus couramment utilisées sont le CSS en ligne et le CSS externe.

CSS intégré – L’élément

ou les règles définies dans n'importe quel fichier de feuille de style externe.

  • Toute règle définie dans les balises

    remplacera les règles définies dans n'importe quel fichier de feuille de style externe.

  • Toute règle définie dans le fichier de feuille de style externe a la priorité la plus basse et les règles définies dans ce fichier ne seront appliquées que lorsque les deux règles ci-dessus ne sont pas applicables.

  • Gestion des anciens navigateurs

    Il existe encore de nombreux anciens navigateurs qui ne prennent pas en charge CSS. Nous devons donc faire attention lors de l'écriture de notre CSS intégré dans un document HTML. L'extrait suivant montre comment vous pouvez utiliser les balises de commentaire pour masquer le CSS des anciens navigateurs -

    <style type = "text/css">
       <!--
          body, td {
             color: blue;
          }
       -->
    </style>
    

    Commentaires CSS

    Plusieurs fois, vous devrez peut-être ajouter des commentaires supplémentaires dans vos blocs de feuille de style. Ainsi, il est très facile de commenter n'importe quelle partie de la feuille de style. Vous pouvez simplement mettre vos commentaires dans /*.....ceci est un commentaire dans la feuille de style.....*/.

    Vous pouvez utiliser /* ....*/ pour commenter des blocs multilignes de la même manière que vous le faites dans les langages de programmation C et C++.

    Exemple

    Démo en direct

    <!DOCTYPE html>
    <html>
       <head>
          <style>
             p {
                color: red;
                /* This is a single-line comment */
                text-align: center;
             }
             /* This is a multi-line comment */
          </style>
       </head>
    
       <body>
          <p>Hello World!</p>
       </body>
    </html>
    

    Cela produira le résultat suivant -

    #CSS #Inclusion

    Related Articles

    Back to top button