Attribut de remplissage CSS
En CSS, il est possible de spécifier différents remplissages pour différents côtés :
Instance
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<style>
p
{
background-color:yellow;
}
p.padding
{
padding-top:25px;
padding-bottom:25px;
padding-right:50px;
padding-left:50px;
}
</style>
</head>
<body>
<p>这是一段没有指定填充。</p>
<p class="padding">这一段指定l填充。</p>
</body>
</html>Exécutez le programme pour l'essayer
Padding - attribut raccourci
Pour raccourcir le code, il est possible de spécifier toutes les propriétés de padding en une seule attribut.
C'est ce qu'on appelle l'attribut d'abréviation. L'abréviation de toutes les propriétés de remplissage est "padding":
Propriété Padding, qui peut avoir une à quatre valeurs.
rembourrage : 25px 50px 75px 100px;
le rembourrage supérieur est de 25px
le rembourrage droit est de 50px
le rembourrage inférieur est de 75px
Le rembourrage gauche est de 100px
remplissage : 25px 50px 75px;
rembourrage :25px 50px ;rembourrage supérieur et inférieur est de 25px
le rembourrage gauche et droit est de 50px
padding:25px ;Tout le rembourrage est de 25px
Exemple
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<style>
p
{
background-color:yellow;
}
p.padding
{
padding:25px 50px;
}
</style>
</head>
<body>
<p>这是一段没有指定填充。</p>
<p class="padding">这一段指定l填充。</p>
</body>
</html>Exécutez le programme et essayez-le
Exemple
démontre l'utilisation d'attributs abrégés pour définir toutes les propriétés de remplissage dans une déclaration, qui peut avoir une à quatre valeurs. <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<style>
p.ex1 {padding:2cm;}
p.ex2 {padding:0.5cm 3cm;}
</style>
</head>
<body>
<p class="ex1">这个文本填充两边相等。填充每边2厘米。</p>
<p class="ex2">这个文本填充两边相等。填充每边2厘米。</p>
</body>
</html>Exécutez le programme et essayez-le
section suivante