Maison > Article > interface Web > Solution au problème de hauteur div 100% sous déclaration
Solution au problème de hauteur div 100% sous déclaration
- 高洛峰original
- 2017-03-23 09:08:142574parcourir
Lors de l'utilisation de code HTML pour créer une page Web, si 8b05045a5be5764f313ed5b9168a17e6 est déclaré et qu'un div dans le code a une hauteur définie sur 100 %, un affichage anormal peut se produire. Par exemple, le code suivant :
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
* {margin:0px;padding:0px;}
div {
background-color:red;
width:200px;
height:100%;
}
</style>
</head>
<body>
<div></div>
</body>
</html>Le résultat affiché est : rien Pourquoi ?
La raison est que la norme HTML5 l'exige lorsque la hauteur ou la largeur est définie sur un pourcentage. , la balise parent est référencée . Si vous comprenez cette phrase, le problème sera plus facile à résoudre. La balise parent de la balise dc6dce4a544fdca2df29d5ac0ea9906b est 6c04bd5ca3fcae76e30b72ad730ca86d. Nous pensons naïvement que la hauteur de la balise 6c04bd5ca3fcae76e30b72ad730ca86d pas défini, le dc6dce4a544fdca2df29d5ac0ea9906b est affiché. Ajoutez un paramètre body {height:100%;} en css, aperçu, le résultat est : toujours rien
Pourquoi ? Bien que la hauteur de la balise 6c04bd5ca3fcae76e30b72ad730ca86d soit définie sur 100 %, la balise 6c04bd5ca3fcae76e30b72ad730ca86d est la balise 100db36a723c770d327fc0aef2ce13b1 et la hauteur de cette balise doit également être définie. Les paramètres finaux à ajouter sont donc html, body {height:100%;}
Veuillez noter qu'il y a une virgule entre html et body, pas un espace. Expliquez qu'il s'agit d'un sélecteur multi-étiquettes et non d'un sélecteur dérivé.
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!