CSS Comment ...
Quand un navigateur lit une feuille de style, il sera en forme le document selon elle.
Trois façons d'insérer des CSS
Il ya trois manières d'insérer une feuille de style:
- Feuille de style externe
- Feuille de style interne
- Style en-ligne
Feuille de style externe
Une feuille de style externe est idéal lorsque le style est appliqué à de nombreuses pages. Avec une feuille de style externe, vous pouvez modifier l'apparence d'un site Web entier en changeant un seul fichier. Chaque page doit être liée à la feuille de style en utilisant la balise link. La balise link passe à l'intérieur de la section de tête:
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>
Une feuille de style externe peut être écrit dans n'importe quel éditeur de texte. Le fichier ne doit pas contenir toutes les balises html. Votre feuille de style devrait être enregistré avec une extension. Css. Un exemple d'un fichier feuille de style est illustré ci-dessous:
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
Ne pas ajouter un espace entre la valeur de la propriété et l'unité (comme margin-left: 20 px). La manière correcte est: margin-left: 20pxFeuille de style interne
Une feuille de style interne doit être utilisé quand un seul document a un style unique. Vous définissez les styles internes dans la section head d'une page HTML, en utilisant la balise <style>, comme ceci:
<head>
<style type="text/css">
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
</style>
</head>
<style type="text/css">
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
</style>
</head>
Styles en ligne
Un style en ligne perd beaucoup des avantages des feuilles de style en fonction du contenu de mélange avec la présentation. Utilisez cette méthode avec parcimonie!
Pour utiliser des styles inline que vous utilisez l'attribut de style dans la balise concernée. L'attribut style peut contenir n'importe quelle propriété CSS. L'exemple montre comment changer la couleur et la marge de gauche d'un paragraphe:
<p style="color:sienna;margin-left:20px">This is a paragraph.</p>
Plusieurs feuilles de style
Si certaines propriétés ont été fixés pour le même sélecteur de différentes feuilles de style, les valeurs seront hérités de la feuille de style plus précis.
Par exemple, une feuille de style externe possède ces propriétés pour le sélecteur de h3:
h3
{
color:red;
text-align:left;
font-size:8pt;
}
{
color:red;
text-align:left;
font-size:8pt;
}
Et une feuille de style interne a ces propriétés pour le sélecteur de h3:
h3
{
text-align:right;
font-size:20pt;
}
{
text-align:right;
font-size:20pt;
}
Si la page avec la feuille de style interne est également liée à la feuille de style externe pour les propriétés H3 sera:
color:red;
text-align:right;
font-size:20pt;
text-align:right;
font-size:20pt;
La couleur est héritée de la feuille de style externe et le texte-alignement et la taille de police est remplacé par la feuille de style interne.
Styles multiples Will Cascade dans une
Les styles peuvent être spécifiés:
- l'intérieur d'un élément HTML
- l'intérieur de la section de tête d'une page HTML
- dans un fichier CSS externe
Astuce: Même plusieurs feuilles de style externes peuvent être référencées dans un document HTML.
Pour en cascade
Quel est le style sera utilisée quand il ya plus d'un style spécifié pour un élément HTML?
De manière générale on peut dire que tous les styles seront «en cascade» dans une nouvelle feuille de style "virtuel" par les règles suivantes, où le numéro quatre a la plus haute priorité:
- Navigateur par défaut
- Feuille de style externe
- Feuille de style interne (dans la section head)
- Le style en ligne (à l'intérieur d'un élément HTML)
Ainsi, un style en ligne (à l'intérieur d'un élément HTML) a la priorité la plus élevée, ce qui signifie qu'il sera remplacer un style défini à l'intérieur de la balise <head>, ou dans une feuille de style externe, ou dans un navigateur (une valeur par défaut).
Remarque: Si le lien vers la feuille de style externe est placé après la feuille de style interne dans <head> HTML, la feuille de style externe remplace la feuille de style interne!
0 commentaires:
Post a Comment
HELLO VISITORS THANKS FOR YOUR VISIT AND COMMENT