Maison > interface Web > tutoriel CSS > Problèmes de hiérarchie (z-index) causés par des valeurs de marge négatives

Problèmes de hiérarchie (z-index) causés par des valeurs de marge négatives

巴扎黑
Libérer: 2017-05-21 10:50:25
original
2194 Les gens l'ont consulté

Cet article présente principalement la solution au problème hiérarchique (z-index) causé par les valeurs de marge négatives. Les amis qui en ont besoin peuvent s'y référer. Regardons d'abord ce morceau de code :


Copiez le code

Le code est le suivant :


couleur:Rouge;marge-haut: -5px " mce_style="background-color:Rouge;marge-haut: -5px ">
Accueil du script




Sous IE6 et IE7 , la couche interne Le conteneur est recouvert par la couche externe, comme indiqué sur l'image :

Sous IE8 et ff, le conteneur externe est recouvert par la couche interne, comme indiqué sur l'image :

C'est vraiment fou, si vous voulez obtenir l'effet selon lequel le conteneur externe d'IE8 est recouvert par la couche interne, IE7 peut résoudre le problème en déclenchant la disposition de la couche interne, mais IE6 ne le peut pas. utilisez uniquement position:relative dans la couche interne pour résoudre le problème. Bien sûr, position:relative résout également le problème de ie7, car position:relative elle-même peut déclencher la mise en page.
Regardez le code :



Copiez le code

Le code est le suivant :

:Rouge;margin-top : -5px;position:relative" mce_style="background-color:Red;margin-top: -5px;position:relative">
Accueil du script





Bien sûr, si vous souhaitez que IE8 et FF obtiennent l'effet de IE6 et IE7, il vous suffit d'ajouter overflow:hidden dans la couche externe





Copiez le code

Le code est le suivant :

< a href="http://www.jb51.net/" mce_href="http://www.jb51.net/">Script Accueil< /a>




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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal