Heim > Web-Frontend > HTML-Tutorial > So lösen Sie das Problem, dass das übergeordnete Div nicht automatisch geöffnet werden kann, nachdem das untergeordnete Div auf Float gesetzt wurde.

So lösen Sie das Problem, dass das übergeordnete Div nicht automatisch geöffnet werden kann, nachdem das untergeordnete Div auf Float gesetzt wurde.

不言
Freigeben: 2018-07-25 09:41:47
Original
2578 Leute haben es durchsucht

Der in diesem Artikel mit Ihnen geteilte Inhalt befasst sich mit dem Festlegen von Float für das untergeordnete Div, was dazu führt, dass das übergeordnete Div nicht automatisch geöffnet werden kann. Der Inhalt ist sehr detailliert Schauen Sie sich den spezifischen Inhalt an. Ich hoffe, er kann allen helfen.

Grund: Das innere p verliert die Stile von clear:both und display:block nach float:left, sodass das äußere p nicht geöffnet wird.

Im Folgenden sind mehrere Lösungen aufgeführt (vorausgesetzt, die Klasse des übergeordneten p ist „Container“):

  • Methode 1. Verwenden Sie Pseudoklassen

container::after{
    display: block;
    height:0;
    content: '';
    clear: both;
}
container{
    display: inline-block; /*第一种撑开办法,底下会有部分被遮到,所以添加这行,就完美了*/
}
Nach dem Login kopieren
  • Methode 2. Das Prinzip der Nichtverbreitung besteht darin, dass der Überlauf nicht sichtbar ist. Fügen Sie also einfach overflow:auto; zum übergeordneten p hinzu 🎜>

  • container{
        overflow: auto;/*让主要内容区随内容自动撑开*/
        overflow-y:hidden;/*把出现的滚动条隐藏,但是底下会被遮到一点,不完美*/
         _height:1%;/*对IE的hack*/
    }
    Nach dem Login kopieren
    • Methode 3. Sie können am Ende ein Sub-P hinzufügen, um den Float zu löschen:

      <p class="clear"></p>Legen Sie den Stil fest.
      clear{clear:both; font-size:0; height:1%;}

    • Methode 4: Sie können die Höhe des übergeordneten p festlegen (dh manuell erweitern, was unflexibel ist);

    • Methode 5 , setze es direkt auf das übergeordnete p

      Dadurch wird es auch automatisch erweitert display: inline-block;

    • Methode 6. Setze das untergeordnete p direkt

      und es kann auch automatisch geöffnet werden, aber Das Satzproblem muss untersucht und untersucht werden display: inline-block;

    • Methode 7. Ich habe im Internet auch eine Methode gefunden, um dem übergeordneten p Attribute hinzuzufügen:

      display:table;

    • Methode 8. Wenn das untergeordnete p schwebt, kann ich Sie nicht fangen? OK, ich lasse auch das übergeordnete p schweben: Die übergeordnete p-Einstellung

      kann auch verwendet werden float: left;

    Verwandte Empfehlungen:

    tinymce und prism implementieren hervorgehobenen Code und chinesischen Konfigurationsmethodenprozess

    Einführung in das dynamische Generieren und Hinzufügen von HTML-Elementen Attribute zu Elementen (Code angehängt)

    Das obige ist der detaillierte Inhalt vonSo lösen Sie das Problem, dass das übergeordnete Div nicht automatisch geöffnet werden kann, nachdem das untergeordnete Div auf Float gesetzt wurde.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage