Maison > Article > interface Web > Notes du cinquième jour HTML5
Propriétés CSS
Propriétés du paragraphe
letter-spacing:10px; la distance entre les mots
word-spacing:1px la distance entre les mots (principalement utilisé en anglais; sites Web)
text-transform:capitalize (mettre en majuscule la première lettre de chaque mot) majuscule (tout en majuscules) minuscule (tout en minuscules) (Principalement utilisé sur les sites Web en anglais)
espace blanc :normal /nowrap (pas de saut de ligne)
Modèle de boîte
Toutes les balises sont traitées comme une boîte
Traitez les éléments au niveau du bloc comme une grande boîte et en ligne L'élément est ; vu comme une petite boîte
De quelles parties se compose l'incarnation d'un modèle de boîte ?
largeur hauteur (largeur et hauteur du contenu) remplissage (marge intérieure/remplissage intérieur) bordure (bordure) marge (marge extérieure)
bordure : (bordure)
bordure -top :
border-bottom :
border-left :
border-right :
border-bottom : (bordure inférieure)
border-bottom-style : plein (ligne continue) pointillé (ligne pointillée) pointillé (ligne pointillée) double (double ligne continue) style de ligne de bordure
border-bottom-color : rouge/# fff ; La couleur de la bordure
border-bottom-width:3px;L'épaisseur de la bordure
border:3px rouge uni;
border:none/0;
border-top:none/0;
border-collapse:collapse (supprimer les bords en double)
padding : (marge intérieure, remplissage intérieur, remplissage intérieur) distance du contenu à border Relative
padding-top:
padding-left:
padding-right:
padding-bottom:
(padding affectera la largeur et la hauteur de la boîte)
padding:10px (haut, bas, gauche et droite)
padding:10px 20px (haut, bas, gauche et droite)
rembourrage : 10px 20px 30px ; (en haut à droite en bas) Gauche = Droite "Suivez le principe du sens des aiguilles d'une montre"
rembourrage : 10px 20px 30px 40px (en haut à droite, en bas à gauche)
padding: 0 0 5px 0; (ne peut être écrit que comme ceci)
margin : (marge, padding) la distance entre les étiquettes
relative
les marges supérieure et inférieure des éléments en ligne ne peuvent pas être atteint
marges supérieure et inférieure des éléments au niveau du bloc L'espacement ne peut pas être accumulé et ne peut prendre que la valeur maximale
Les marges sur les côtés gauche et droit des éléments en ligne et au niveau du bloc sont valeurs cumulées
Les marges n'affecteront pas la largeur et la hauteur de la boîte
margin:10px (haut, bas, gauche et droite)
margin:10px 20px; haut, bas, gauche et droite)
margin:10px 20px 30px; (haut, droite, bas) left=right "Suivez le principe du sens des aiguilles d'une montre"
margin: 10px 20px 30px 40px; en haut à droite, en bas à gauche)
marge : 0 0 5px 0; (ne peut s'écrire que comme ceci)
Taille réelle d'une boîte :
Largeur : la largeur de la bordure du contenu (largeur) (gauche et droite) le remplissage ((gauche et droite) la marge (gauche et droite)
Hauteur : la hauteur de la bordure du contenu (hauteur) (haut et bas) le remplissage (haut et bottom) margin( Top et bottom)
Application des marges : Centrer la boite dans le navigateur, dans la méthode de centrage de l'élément parent
margin:0 auto;
Nouveaux attributs en CSS3
box-sizing:border-box/content-box Ignorer les valeurs de border et padding
Ce qui précède est le contenu des notes du cinquième jour de HTML5 . Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www.php.cn) !