Contrôle d'apparences avec styles

Les feuilles de style en cascade (CSS) vous offrent un meilleur contrôle de l’aspect et de la présentation de vos pages Web. Grâce à elles, vous pouvez spécifier de manière plus précise l’emplacement et l’aspect des éléments sur une page.

Une CSS peut être externe, interne ou intraligne, relative à une page Web et une page Web peut utiliser un ou plusieurs de ces types de CSS simultanément. En général, les styles définis dans une CSS intraligne sont prioritaires sur ceux définis dans une CSS interne ou externe, et les styles d’une CSS interne sont prioritaires sur les styles définis dans une CSS externe.

CSS externe

Utilisez une feuille de style externe si vous souhaitez appliquer les mêmes styles de manière cohérente sur plusieurs ou sur toutes les pages de votre site. Si vous définissez des styles dans une ou plusieurs feuilles de style externes et si vous les liez à des pages Web, la cohérence de la présentation sur ces pages est garantie. Si vous décidez de changer un style, vous devez effectuer un seul changement (dans la feuille de style externe) : celui-ci s’appliquera à toutes les pages liées à cette feuille de style.

Une CSS externe est contenue dans un fichier .css, tel que global.css. La syntaxe d’une CSS externe est identique à celle d’une CSS interne (voir l’exemple donné dans la section suivante), sauf que les styles définis dans une CSS externe ne sont pas entourés de balises <style>.

CSS interne

Utilisez une CSS interne, parfois appelée CSS incorporée, si vous souhaitez définir des styles uniquement pour la page actuelle et lorsque vous voulez remplacer les styles définis dans une CSS externe attachée à la page Web actuelle.

Une CSS interne est incorporée aux balises <head> d’une page Web.

<style type="text/css">
.alert {
    font-weight: bold;
    color: #FF0000;
}
h1 {
    font-size: 16pt;
    font-family: Arial, Helvetica, sans-serif;
}
#headlines {
    border-color: #000000;
    border-width: thin;
    border-style: solid;
}
</style> 

CSS intraligne

Utilisez des styles intralignes pour appliquer des propriétés de feuilles de style en cascade à des éléments individuels d’une page lorsque vous n’avez pas besoin de réutiliser le style. Un style intraligne est défini dans la balise de début d’un élément HTML dans la page Web.

<p style="font-weight: bold; font-style: italic; color: #FF0000;">

Voir aussi

Tâches

Créer une feuille de style en cascade

Concepts

Utilisation de styles

Référence des feuilles de style en cascade