Maison >interface Web >tutoriel HTML >Une brève introduction aux connaissances CSS

Une brève introduction aux connaissances CSS

零下一度
零下一度original
2017-06-26 15:43:481335parcourir

1. Définition CSS

CSS fait référence aux feuilles de style en cascade, qui est un langage de feuille de style utilisé pour décrire la présentation de documents HTML ou XML (y compris les langages de branche XML tels que SVG et XHTML). CSS décrit comment les éléments doivent être rendus à l'écran, sur papier, audio et autres supports.

2.Pourquoi utiliser CSS

Les pages Web sont composées de balises HTML, et ces balises seront saisies et rendues selon la méthode par défaut du navigateur. Si vous souhaitez modifier ces styles par défaut, c'est le cas. Il est recommandé d'utiliser CSS, car cela permet non seulement de séparer le contenu et les performances, mais facilite également la maintenance.

3. Syntaxe CSS

La syntaxe CSS se compose de deux parties principales : le sélecteur et une ou plusieurs déclarations.

selector {declaration1; declaration2; ... declarationN }

Chaque déclaration est constituée d'un attribut et d'une valeur.

selector {property: value}

Dans l'exemple suivant, h1 est le sélecteur, color et font-size sont des attributs, et red et 14px sont des valeurs.

h1 {color:red; font-size:14px;}

Cette image représente de manière vivante la structure du code ci-dessus

Les CSS sur les espaces et les majuscules ne sont pas sensible, c'est-à-dire que les majuscules et les minuscules peuvent être utilisées. Le fait que des espaces soient inclus ou non n'affectera pas l'effet de fonctionnement du CSS dans le navigateur

/* 属性为大小,值为小写,并且冒号后面有多个空格 */
 .box {COLOR:   blue;
}/* 建议写法 */.box {color: blue;
}
Les deux méthodes d'écriture ci-dessus sont L'effet affiché dans le navigateur est le même.

4. Commentaires CSS

Comme le langage HTML, CSS a également des commentaires

4.1 Commentaires sur une seule ligne

/* 这是表示单行的注释 */
<.>Remarque : Les commentaires ne peuvent pas être imbriqués. Par exemple, l'écriture suivante est incorrecte

/* 这是表示*/单行的注释 *//* 这是表示单行的注释 /* */ */
Commentaires multilignes

.
/*
 * 这是表示多行的注释
 * 注释内容1
 * 注释内容2 */
5. Méthode d'introduction

5.1. Style en ligne

Le style en ligne consiste à définir le style CSS dans l'attribut style de la balise.

<div style="..."></div>
5.2. Embedded

Embedded consiste à écrire des styles CSS ensemble dans le