Positionnement absolu et masquage du débordement
P粉451614834
2023-08-21 19:30:21
<p>Nous avons deux DIV, l’un imbriqué dans l’autre. Si le DIV externe n’est pas défini pour être en position absolue, alors le DIV interne en position absolue ne respectera pas le masquage de débordement du DIV externe. </p>
<p><br /></p>
<pre class="brush:css;toolbar:false;">#first {
largeur : 200 px ;
hauteur : 200px ;
couleur de fond : vert ;
débordement caché;
}
#deuxième {
largeur : 50 px ;
hauteur : 50px ;
couleur de fond : rouge ;
position : absolue ;
gauche : 250 px ;
haut : 250 px ;
}</pré>
<pre class="brush:html;toolbar:false;"><div id="first">
<div id="seconde"></div>
<div id="troisième"></div>
</div></pre>
<p><br /></p>
<p>Existe-t-il un moyen de faire en sorte que le DIV interne suive le masquage de débordement du DIV externe sans définir le DIV externe pour qu'il soit positionné de manière absolue (car cela briserait notre disposition globale) ?
De plus, le positionnement relatif n'est pas une option pour notre DIV interne puisque nous devons « mettre en surbrillance » une table TD. </p>
<p><br /></p>
<pre class="brush:css;toolbar:false;">#first {
largeur : 200 px ;
hauteur : 200px ;
couleur de fond : vert ;
}
#deuxième {
largeur : 50 px ;
hauteur : 400px ;
couleur de fond : rouge ;
position : relative ;
gauche : 0px ;
haut : 0px ;
}</pré>
<pre class="brush:html;toolbar:false;"><table id="first">
<tr>
<td>
<div id="seconde"></div>
</td>
≪/tr>
</table></pre>
<p><br /></p>
<p>Y a-t-il d’autres options ? </p>
Qu'en est-il de l'utilisation de divs externes
position: relative
? Dans l’exemple du masquage du div interne. Puisque haut ou gauche ne sont pas spécifiés, il ne se déplacera pas dans la mise en page.Convertissez l'externe
<div>
设置为position: relative
,将内部的<div>
设置为position: absolute
. Cela devrait fonctionner pour vous.