Quatre types de feuilles de style en cascade dans la conception web

category Internet & médias sociaux / Web design & développement / Pages web construction

Cascading Style Sheets (CSS) se répartissent en quatre types différents (ou styles). Lorsque vous comprenez comment ces quatre types différents de travailler, vous serez coiffer vos pages Web plus efficacement.

Sommaire

  • Web design services personnalisés
  • balises tout au long de votre site ou dans une section particulière:

    • Pour garder votre CSS organisée, utiliser des balises CSS de commentaires pour identifier les différentes sections de CSS au sein de votre feuille de style. Par exemple, vous pouvez avoir une section pour les styles d'en-tête, pour les styles de la barre latérale, pour les styles de navigation et pour les styles de bas de page. Commentaires CSS utilisent le / * 133- # * / la syntaxe:

    / * Ceci est un commentaire * /

    Style de classe (aka style personnalisé)

    Les styles de classe peuvent être appliqués de manière sélective à tout élément HTML en utilisant la class ="customname" syntaxe. Par exemple, vous pouvez créer un style de classe appelé culminant qui a une couleur de fond jaune vif:

    .sélectionnez {background-color: # FFFF33-}



    Pour appliquer ce style à tout contenu, vous souhaitez simplement utiliser l'attribut de classe:

    class ="culminant">Ceci est très important

    ID

    Styles d'identité sont automatiquement appliqués à un élément HTML sur la page avec le même ID. Par exemple, si vous souhaitez ajouter un

    tag pour tenir votre sidebar, tu donnerais ce conteneur un identifiant sémantique tels que la barre latérale:

    #sidebar {background-color: # 66CCFF-}

    Votre code pourrait alors ressembler à ceci: 

    id ="sidebar">
    Web Design Services personnalisés
    # 133;

    Balise

    Styles de balises vous permettent de redéfinir automatiquement le style et le positionnement d'une balise HTML existante, comme corps, p, h1, ou li. Par exemple, vous pouvez définir les styles de police pour tous vos

    balises tout au long de votre site ou dans une section particulière:

    h1 {font-family: Arial, Helvetica, sans-serif-font-size: 1.2em-font-weight: bold-color: # 8c9292-text-transform: uppercase-}

    Composé

    Styles composés sont également appliqués automatiquement à un élément en fonction de son emplacement dans la page, comme tous les

    balises à l'intérieur du
    avec l'ID de la barre latérale, qui se trouve à l'intérieur d'un conteneur parent avec l'ID de peignoir:

    #wrapper #sidebar h1 {color: # CC3300-font-family: "Times New Roman", la Géorgie, Serif-}
    Articles Similaires

    A propos Auteur
    Comment utiliser une feuille de style externe pour HTML5 et CSS3 programmation Comment utiliser une feuille de style externe pour HTML5 et CSS3 programmation

    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…

    Bases de styles CSS3 Bases de styles CSS3

    La meilleure façon de commencer avec des styles en CSS3 est de les voir simplement comme un moyen de mise en forme des informations à l'écran. Parce que la plupart des informations que vous allez travailler avec du texte, il est plus facile de…

    Comment construire styles de composés dans des feuilles de style en cascade (CSS) Comment construire styles de composés dans des feuilles de style en cascade (CSS)

    Après que vous avez maîtrisé travailler avec classe personnalisée, tag redéfinit et styles d'identité dans Cascading Style Sheets (CSS), vous pouvez entrer dans les ligues majeures de styles de composés. Pour comprendre comment travailler…

    Comment créer des styles externes en CSS3 Comment créer des styles externes en CSS3

    La plupart des développeurs utilisent styles externes dans CSS3 pour réduire la quantité de travail nécessaire pour maintenir un site. Un fichier .CSS unique contient tous les styles pour le site, ce qui signifie que le changement de style…

    Comment créer des styles de lien hypertexte avec les pseudo-classes dans des feuilles de style en cascade (CSS) Comment créer des styles de lien hypertexte avec les pseudo-classes dans des feuilles de style en cascade (CSS)

    Un des usages les plus courants de styles composés de feuilles de style en cascade (CSS) est de créer des hyperliens avec les pseudo-classes, qui peuvent être utilisés pour modifier la couleur et les attributs de liens hypertextes par défaut.Le…

    Comment créer des styles de id dans des feuilles de style en cascade (CSS) Comment créer des styles de id dans des feuilles de style en cascade (CSS)

    Un Style ID est une sorte d'hybride Cascading Style Sheet (CSS) règle de style qui combine certains éléments des deux styles de classe personnalisée et l'étiquette Redéfinir. Avec un style d'identité, les déclarations définies dans ce style…

    Comment faire pour coiffer les paragraphes, les titres, et les pieds avec CSS3 Comment faire pour coiffer les paragraphes, les titres, et les pieds avec CSS3

    Lorsque vous êtes style paragraphes, titres, et pieds de page, la plupart des travaux peuvent être automatiquement accompli par la création de styles tag Redéfinir pour le tag et cependant de nombreuses balises de titre que vous souhaitez…

    Comment faire pour coiffer listes et des tableaux avec CSS3 Comment faire pour coiffer listes et des tableaux avec CSS3

    Listes de style et tables est un peu différent de coiffage contenu dans le corps de la page, parce que les deux listes et des tableaux ont des étiquettes spécifiques qui peuvent être redéfinis pour contrôler la façon dont le contenu se trouve…

    Comment utiliser plusieurs styles avec CSS3 Comment utiliser plusieurs styles avec CSS3

    Comprendre les règles d'héritage dans CSS3 vous permet de créer des sites intéressants qui nécessitent un minimum d'entretien. En suivant ces règles, lorsque la maintenance est nécessaire, vous devez normalement faire un seul changement,…

    Placer css dans votre conception de sites Web Placer css dans votre conception de sites Web

    Vous pouvez utiliser les feuilles de style en cascade (CSS) dans vos pages Web de trois façons: externe, interne, et en ligne. Que vous utilisez dépend de comment vous voulez que votre conception de travailler.CSS externeExterne est la meilleure…

    Mise en place en html css Mise en place en html css

    CSS est un langage de feuille de style utilisée pour définir l'apparence et le formatage d'un document écrit dans un langage de balisage - souvent HTML. UN style en ce sens, est un ensemble de formatage de texte des instructions, telles que la…

    L'anatomie des feuilles de style en cascade (CSS) L'anatomie des feuilles de style en cascade (CSS)

    Cascading Style Sheets (CSS) est une feuille de style utilisé pour décrire la sémantique de présentation - le style et le positionnement - des éléments dans un document Web écrit dans un langage de balisage simple.Syntaxe CSS se compose de…

    Les avantages de rubriques html Les avantages de rubriques html

    Une des options de formatage de texte les plus courants au format HTML est le style de titre. En HTML, vous gagnez de nombreux avantages à utiliser les styles de titre (H1, H2, et ainsi de suite) au texte de style qui sert de titres ou des titres.…

    Comment feuilles de style en cascade (CSS) travail Comment feuilles de style en cascade (CSS) travail

    CSS, ou Cascading Style SHEETs, est le code qui contrôle non seulement l'aspect visuel de vos éléments HTML individu, mais aussi où les éléments apparaissent dans la relation à l'autre, et parfois comment ils interagissent et animent. Entre…

    » » » » Quatre types de feuilles de style en cascade dans la conception web