Démonstration de déclaration de styles CSS

Internet au service de l'action humanitaire

D'abord en permettant d'avoir accès à tous les sites des associations humanitaires et des organisations internationales. Vous souhaitez faire un don, comprendre comment une mission est organisée, savoir quels sont les principaux pays où les ONG interviennent ? Il vous suffit de surfer d'un site à l'autre. Voir le site

Code source :

<!-- Insertion de style directement dans les balises avec l'attribut STYLE -->
<html>
  <body style="font-family: Arial, Verdana; font-size: 11pt;">
    <div style="font-size: 14pt; font-weight: bold;"> ... </div>
    <div> ... <a href=" ... "> ... </a></div>
  </body>
</html>

<!-- Insertion de styles dans le document par l'intermédiaire de la balise <STYLE> -->
<html>
  <head>
    <style type="text/css">
      body {
        font-family: Arial, Verdana;
        font-size: 11pt;
      }
      .titre {
        font-size: 14pt;
        font-weight: bold;
      }
      A:link {
        text-decoration: none; 
        color: #5B2D00;
      }
      A:visited {
        text-decoration: none; 
        color: #7C3EBA;
      }
      A:hover {
        text-decoration: underline; 
        color: #FF0000;
      }
    </style>
  </head>
  <body>
    <div class="titre"> ... </div>
    <div> ... <a href=" ... "> ... </a></div>
  </body>
</html>

<!-- Insertion de styles externes dans le document par l'intermédiaire de la balise <LINK> -->
<!-- Fichier externe : style.css -->
body {
  font-family: Arial, Verdana;
  font-size: 11pt;
}
.titre {
  font-size: 14pt;
  font-weight: bold;
}
A:link {
  text-decoration: none; 
  color: #5B2D00;
}
A:visited {
  text-decoration: none; 
  color: #7C3EBA;
}
A:hover {
  text-decoration: underline; 
  color: #FF0000;
}

<!-- document HTML : doc.html -->
<html>
  <head>
    <link rel="StyleSheet" type="text/css" href="style.css">
  </head>
  <body>
    <span class="titre"> ... </span>
    <div> ... <a href=" ... "> ... </a></div>
  </body>
</html>