Introduction détaillée aux styles courants CSS

font-family définit 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 Taille, les valeurs négatives ne sont pas autorisées

p { font-size:14px;}

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

normal normal police, équivalente à la valeur numérique 400

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

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

Code XML/HTML Copier le contenu dans le presse-papiers

1. p {font-weight:bold;}

font-style contrôle si la police est italique

normal spécifie le style de police du texte comme police normale

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

oblique spécifie le style de police du texte comme étant une police oblique, en inclinant 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 # , une combinaison de 6 caractères ou chiffres hexadécimaux, tels que : #FFFFFF, #000000...

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

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

texte-décoration texte lignes décoratives

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

Blink 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. 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 margin: auto | length

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

Forme abrégée :

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, marges gauche et droite, marge inférieure

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

remplissage de la marge intérieure : longueur

padding-top définit le haut Le remplissage de

padding-bottom définit le rembourrage inférieur

padding-left définit le rembourrage gauche

padding-right définit le rembourrage droit

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

Opacité de la transparence : b64d575aa2ce8ca79ed05030b07ff817

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

Écriture compatible avec tous les navigateurs :

p{ filter:alpha(opacity=50); }  /* IE6-IE8 */   
p{ opacity:0.5; }  /* 现代浏览器 */

Les styles CSS courants (partagés) sont tout le contenu partagé par l'éditeur. J'espère qu'il pourra vous donner une référence, et j'espère également que tout le monde soutiendra le site Web PHP chinois.

Pour une introduction plus détaillée aux styles CSS couramment utilisés et aux articles connexes, veuillez prêter attention au site Web PHP chinois !