Maison > Article > interface Web > Comment résoudre le problème selon lequel le div parent ne peut pas être ouvert automatiquement une fois que le div enfant est défini sur flottant.
Le contenu partagé avec vous dans cet article concerne la configuration de float sur le div enfant, ce qui empêchera le div parent de s'ouvrir automatiquement. Le contenu est très détaillé. Ensuite, prenons un. regardez le contenu spécifique. J'espère que cela pourra aider tout le monde.
Raison : Le p interne perd les styles clear:both et display:block après float:left, donc le p externe ne sera pas ouvert.
Voici plusieurs solutions (en supposant que la classe du parent p est "conteneur") :
Méthode 1. Utiliser des pseudo-classes
container::after{ display: block; height:0; content: ''; clear: both; } container{ display: inline-block; /*第一种撑开办法,底下会有部分被遮到,所以添加这行,就完美了*/ }
Méthode 2. Le principe de non-ouverture est que le débordement n'est pas visible, il suffit donc d'ajouter overflow:auto au parent IE doit utiliser _height:1%; ;
container{ overflow: auto;/*让主要内容区随内容自动撑开*/ overflow-y:hidden;/*把出现的滚动条隐藏,但是底下会被遮到一点,不完美*/ _height:1%;/*对IE的hack*/ }
Méthode 3. Vous pouvez ajouter un sous-p à la fin pour effacer le flottant : 5e61f882fc28a1ad04b8488b9fa829db94b3e26ee717c64999d7867364b1b4a3
Définissez le style. clear{clear:both; font-size:0; height:1%;}
Méthode 4. Vous pouvez définir la hauteur du parent p (c'est-à-dire l'agrandir manuellement, ce qui est inflexible) ; 🎜>Méthode 5. Réglez directement la hauteur du p parent
comme ceci Il peut également être ouvert automatiquementdisplay: inline-block;
Méthode 6. Réglez directement le sous-p
display: inline-block;
Méthode 7. J'ai également trouvé une méthode sur Internet pour ajouter des attributs au parent p :
display:table;
Méthode 8. Si l'enfant p flotte, je ne peux pas vous piéger ? OK, je laisse le parent p flotter également : Le paramètre parent p
float: left;
Recommandations associées :
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!