简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)

Création CSS

Création CSS

Lorsqu'une feuille de style est lue, le navigateur formatera le document HTML en fonction de celle-ci.

Comment insérer une feuille de style

Il existe trois façons 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 serait idéale lorsque les styles doivent être appliqués à plusieurs pages. Avec les feuilles de style externes, vous pouvez modifier l'apparence de l'ensemble de votre site en modifiant un fichier. Chaque page utilise la balise pour créer un lien vers la feuille de style. La balise est dans l'en-tête (du document) :

<head>
<link rel="stylesheet" type="text/css" href ="mystyle .css">
</head>

Le navigateur lira la déclaration de style du fichier mystyle.css et la formatera selon ce document.

Les feuilles de style externes peuvent être modifiées dans n'importe quel éditeur de texte. Le fichier ne peut contenir aucune balise HTML. Les feuilles de style doivent être enregistrées avec une extension .css. Voici un exemple de fichier de feuille de style :

hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url (""../style/images/back40.gif");}

lamp.gifNe laissez pas d'espace entre la valeur de l'attribut et l'unité. Si vous utilisez "margin-left: 20 px" au lieu de "margin-left: 20px", cela ne fonctionnera que dans IE 6, mais pas dans Mozilla/Firefox ou Netscape.

Feuille de style interne

Lorsqu'un seul document nécessite un style spécial, une feuille de style interne doit être utilisée. Vous pouvez utiliser la balise <style> pour définir une feuille de style interne en haut du document, comme ceci : Balise hr {color:sienna;}
p {margin-left:20px;}

body {background-image:url (""../style/images/back40.gif");}




<head>
<style>
hr {color:sienna;}
p {margin-left:20px;}

body {background-image:url("../style/images/back40.gif");}
</ style>
</head>

Style en ligne

En raison de la nécessité de mélanger performances et contenu Ensemble, les styles en ligne perdent de nombreux avantages des feuilles de style. Utilisez cette approche avec prudence, par exemple lorsque le style ne doit être appliqué qu'une seule fois à un élément.

Pour utiliser des styles en ligne, vous devez utiliser l'attribut style dans la balise appropriée. La propriété Style peut contenir n'importe quelle propriété CSS. Cet exemple montre comment modifier la couleur et la marge gauche d'un paragraphe :

<p style="color:sienna;margin-left:20px">Ceci est un paragraphe</p>

Priorité

Si en feuille de style externe, Feuille de style interne (située à l'intérieur de la balise),

Style en ligne (à l'intérieur de l'élément HTML), si le style du même élément HTML est défini, le style du style en ligne (à l'intérieur de l'élément HTML) prendra effet Leur priorité est donc

    • Les styles en ligne (à l'intérieur des éléments HTML) sont les plus élevés

    • Deuxièmement, la feuille de style interne (située à l'intérieur de la balise)

Enfin, la Feuille de style externe


<🎜><🎜><🎜>
Formation continue
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <style> p {color: #e22c5e } </style> </head> <body> <p STYLE="color: #1c10b4">css的优先级</p> </body> </html>
soumettreRéinitialiser le code
Section précédente section suivante
Liste des didacticiels
obtenir de l'aide
  • Recommandations de cours
  • Téléchargement du didacticiel
Le didacticiel n'est pas disponible au téléchargement pour le moment. Le staff est actuellement en train de l'organiser. Veuillez prêter plus d'attention à ce cours à l'avenir ~

Les étudiants qui ont regardé ce cours apprennent également

Le dernier didacticiel vidéo ThinkPHP 5.1 en première mondiale (60 jours pour devenir un expert PHP en ligne)  492095 joue
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois：Formation PHP en ligne sur le bien-être public，Aidez les apprenants PHP à grandir rapidement！