Styles CSS couramment utilisés

font-family Définissez le nom de la police

Vous pouvez utiliser plusieurs noms, séparés par des virgules, et le navigateur utilisera les polices disponibles dans l'ordre

p { font-family:'宋体','黑体','Arial'; }

font-size définit la taille de la police

length spécifie la taille du texte avec une valeur de longueur, les valeurs négatives ne sont pas autorisées

pourcentage spécifie la taille du texte avec un pourcentage, et la valeur en pourcentage est basée sur la police dans l'objet parent La taille, les valeurs négatives ne sont pas autorisées

p { font-size:14px;}

font-weight contrôle l'épaisseur de la police

police normale normale , équivalent à la valeur numérique 400

gras gras , équivalent à la valeur numérique 700

100~900 Définir les caractères de fin à épais

p { font-weight:bold;}

police -style Contrôler si la police est inclinée

normal Spécifier le texte Le style de police est une police normale

italique spécifie que le style de police du texte est italique Pour les polices spéciales qui ne sont pas conçues avec de l'italique, si vous souhaitez utiliser l'apparence italique, l'oblique sera appliqué

oblique spécifie le style de police du texte comme étant la police italique, inclinez artificiellement le texte au lieu de sélectionner l'italique dans la police

p { font-style: normal; }   

    p { font-style: italic; }   

    p { font-style: oblique; }

police (abréviation du style de police)

例：   

    p{   

    font-style: italic;   

    font-weight: bold;   

    font-size: 14px;   

    line-height: 22px;   

    font-family:'宋体';   

    }   

      

    缩写后：   

    p { font: italic bold 14px/22px '宋体'; }

couleur Couleur du texte

•Mots anglais, tels que : rouge, jaune, vert.. .

•Représentation hexadécimale, commençant par #, 6 caractères hexadécimaux ou combinaison de chiffres, telle que : #FFFFFF, #000000...

•Mode RVB, rouge 0-255, vert 0 -255, bleu 0-255, tel que : RGB(120,33,234)

•Mode RGBA, par exemple : RGBA(255,0,0,0.5), le dernier A signifie transparence 50%

ligne décorative de texte de décoration de texte

aucun par défaut. Définir un texte standard

souligné Définir une ligne sous le texte

surligner Définir une ligne sur le texte

traiter Définir une ligne à travers le texte

clignotant définit le texte clignotant

h1 {text-decoration:overline;}   

    h2 {text-decoration:line-through;}   

    h3 {text-decoration:underline;}

text-shadow text-shadow

h-shadow Obligatoire. La position de l'ombre horizontale. Valeurs négatives autorisées

v-shadow Obligatoire. La position de l'ombre verticale. Valeurs négatives autorisées

flou Facultatif. Distance floue

couleur en option. La couleur de l'ombre

h1{ text-shadow: 2px 2px 2px #ff0000;}

largeur : auto | longueur

hauteur : auto | longueur

p { width:300px;}   

    p { width:50%;}   

    img { height:200px;}   

    p { height:100px;}

marge : auto |

margin-top définit la marge supérieure

margin-bottom définit la marge inférieure

margin-left définit la marge gauche

margin-right définit la marge droite

abréviation :

marge : marge supérieure marge droite marge inférieure marge gauche

marge : marges supérieure et inférieure marges gauche et droite

marge : marge supérieure, marge gauche et droite, marge inférieure

p { width:300px; height:100px; margin:10px;}   

    p { width:300px; height:100px; margin:0 auto;}

Padding : length

padding-top définit le remplissage supérieur

padding-bottom définit le bas padding

padding-left définit le remplissage gauche

padding-right définit le remplissage droit

p { width:300px; height:100px; padding:10px;}

Opacité de transparence : bb239efef97b5b92b6c8c23af5bb18c7

la valeur numérique est une valeur décimale comprise entre 0,0 et 1,0

Compatible avec tous les navigateurs :

p{ filter:alpha(opacity=50); }  /* IE6-IE8 */   

    p{ opacity:0.5; }  /* 现代浏览器 */

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!