Les éléments de bloc en ligne ont les caractéristiques à la fois des éléments en ligne et des éléments de bloc
Alors, comment définir un élément sur un élément de bloc en ligne
display:inline-block;
Remarque : (nouveau dans CSS2.1), les balises <img>, <input> sont de telles balises de bloc en ligne.
Caractéristiques des éléments de bloc en ligne
1, et les autres éléments sont sur la même ligne
2 ; , la hauteur, la largeur, la hauteur de ligne et les marges supérieure et inférieure de l'élément peuvent toutes être définies.
Écrivons un exemple ci-dessous pour définir la largeur, la hauteur, la couleur d'arrière-plan, etc. pour une balise a. La balise a est un élément en ligne par défaut, et la largeur et la hauteur n'ont aucun effet.
Le code est le suivant :
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
a{
display:inline-block; /*内联块状元素*/
width:300px;
height:200px;
background-color:green;
color:red;
}
</style>
</head>
<body>
<a href="#">欢迎大家来到php中文网</a>
</body>
</html>Comme indiqué dans le code ci-dessus, après avoir converti la balise a en un élément de bloc en ligne, nous pouvons définir la largeur et la hauteur
section suivante
