Supports CSS3 feuilles de style externes.

Cette technique vous permet de définir une feuille de style dans un document distinct et l'importer dans vos pages web. Pour voir pourquoi cela pourrait être attrayante, jetez un oeil à l'exemple.

Quand vous regardez le code de externalStyle.html, vous pourriez être surpris de ne pas voir les informations de style évident du tout!

Style externe
Cette page a styles définis pour les paragraphes, le corps et la tête 1.
Les styles sont définis dans une feuille de style externe.

Où vous voyez normalement balises de style (dans la tête), il n'y a pas de style. Au lieu de cela, vous voyez une tag. Cette balise spéciale est utilisée pour connecter le document en cours avec un autre document.

Comment définir le style externe

Lorsque vous utilisez un style externe, les éléments de style ne sont pas intégrés dans l'en-tête de page, mais dans un document tout à fait distincte.

Dans ce cas, la page est reliée à un fichier spécial appelé monstyle.css. Ce fichier contient toutes les règles CSS:

/ * Monstyle.css * / body {background-color: # 333300-color: # FFFFFF-} h1 {color: # FFFF33-text-align: center-: italic 200% fantasme} p {background-color: # FFFF33-color: # 333300-text-align: right; border: 3px rainure # FFFF33-}

La feuille de style ressemble à un style niveau de la page, à l'exception de quelques différences importantes:

• Les règles de feuille de style sont contenus dans un fichier séparé. Le style ne fait plus partie de la page HTML, mais est un fichier entièrement séparé stocké sur le serveur. Fichiers CSS finissent généralement avec le .css l'extension.

• Il n'y a pas balises. Ceux-ci ne sont pas nécessaires parce que le style est plus ancrée dans HTML.

• Le code commence par un commentaire. La / * * / paire indique un commentaire en CSS. Sincèrement, vous pouvez mettre des commentaires en CSS dans le niveau de la page. Fichiers CSS externes ont souvent des commentaires en eux.

• Le document de style n'a pas de HTML. Documents CSS ne contiennent que CSS. Cela vient rapprocher de l'objectif de séparer le style (dans le document CSS) et le contenu (dans le document HTML).

• 
  
  
  
  

  Le document est pas lié à une page en particulier. Le grand avantage de CSS externe est la réutilisation. Le document de CSS ne fait pas partie d'une page en particulier, mais une page peut l'utiliser.

Comment réutiliser un style CSS externe

Feuilles de style externes sont vraiment amusant quand vous avez plus d'une page qui a besoin du même style. La plupart des sites utilisent aujourd'hui plusieurs pages, et ils devraient partager une feuille de style commun à garder une cohérence.

Le code montre comment cela se fait facilement:

Deuxième page
Cette page utilise le même style queexternalStyle.html.

Feuilles de style externes ont des avantages énormes:

• Une feuille de style peut contrôler de nombreuses pages: Généralement, vous avez un grand nombre de différentes pages d'un site web qui partagent tous le même style général. Vous pouvez définir la feuille de style en un seul document et d'avoir tous les fichiers HTML consultez le fichier CSS.

• Les changements globaux sont plus faciles: Si vous êtes en utilisant des styles externes, vous apportez une modification dans un endroit et il est automatiquement propagée à toutes les pages dans le système.

• Séparation du contenu et de la conception: Avec CSS externe, toute la conception est logé dans le CSS, et les données sont au format HTML.

• Mises à jour faciles: Parce que les paramètres de conception de l'ensemble du site sont définis dans un fichier, vous pouvez facilement changer le site sans avoir à déranger les fichiers HTML individuels.

La balise link

La tag est la clé pour ajouter une référence CSS à un document HTML. La tag possède les caractéristiques suivantes:

• La tag fait partie de la page HTML. Utiliser un balise dans votre document HTML pour spécifier quel document CSS sera utilisé par la page HTML.

• La tag se produit uniquement dans l'en-tête. Contrairement à la tag, le tag peut se produire que dans l'en-tête.

• La balise n'a pas de présence visuelle. L'utilisateur ne peut pas voir le tag, seulement ses effets.

• La lien tag est utilisé pour relier le document avec un autre document. Vous utilisez le tag pour décrire la relation entre les documents.

• La tag a une rel attribuer, qui définit le type de relation. Pour l'instant, la seule relation que vous allez utiliser est le stylesheet attribuer.

• La tag dispose également d'un href attribuer, qui décrit l'emplacement de l'autre document.

Les balises de liens sont souvent utilisés pour connecter une page d'un document de style défini de l'extérieur.

La plupart des gens se réfèrent à des liens hypertextes créés par l'ancre () Tag que des hyperliens ou des liens. Cela peut conduire à une certaine confusion, car, dans ce sens, la balise link ne crée pas ce type de lien.

Comment spécifier un lien externe

Pour utiliser le tag pour spécifier une feuille de style externe, procédez comme suit:

1. Définir la feuille de style.

   Feuilles de style externes sont très semblables à ceux que vous connaissez déjà. Il suffit de mettre tous les styles dans un document de texte séparé sans et balises.

2. Créer un lien élément dans la zone de la tête de la page HTML pour définir le lien entre les pages HTML et CSS.

   Mon élément de liaison ressemble à ceci:

3. Met le lien»de la relation en définissant la rel = "stylesheet"Attribut.

   Honnêtement, stylesheet est presque la seule relation que vous aurez jamais utiliser, ce qui devrait devenir automatique.

4. Spécifiez le type de style en réglant type = "text / css».

5. Déterminer l'emplacement de la feuille de style avec le href attribuer.