Wie zu Steuern " div " überschneidung in html

Ich bin erstellen einer Webseite, Und ich habe zwei divs, A und B zum Beispiel.
Eine position ist fixed und es ist auf der Oberseite der Seite, aber B ' s position ist absolute und ist irgendwo in der Mitte der Seite. Wenn Sie sich Überlappen, B kommt nach oben Ein, Aber ich wollen, dass dies anders herum sein. Ich will Eine auf der Oberseite des nichts, aber ich weiß nicht, wie das zu tun.

Bitte beachten Sie, ändern Ihre Position, das ist keine option.

Vielen Dank im Voraus. 🙂

Werfen Sie einen Blick hier, vielleicht hilft es ja

InformationsquelleAutor Makan Tayebi | 2013-03-15

  1. 3

    z-index-Wert haben, passen Sie Sie entsprechend an, um Schicht.
    seine eine Stil-Eigenschaft: style="z-index:200"....

    InformationsquelleAutor Tirupathi Raju

  2. 2

    Können Sie z-index css-Einstellung zu modifizieren, nicht statisch positioniertes element, um:

    div#A { z-index: 2; }
div#B { z-index: 1; }

    Einen wird angezeigt, über B.

    InformationsquelleAutor aorcsik

  3. 1

    Geben Eine größere z-index Eigenschaft als B.

    div.a {
    z-index:2;
}
div.b {
    z-index:1;
}

    Können Sie nachlesen, was z-Indizes tun über an der MDN, aber in einer nussschale, "Wenn sich Elemente überlappen, z-Reihenfolge bestimmt, welche eine deckt den anderen. Ein element mit einem größeren z-index in der Regel umfasst ein element mit einer niedrigeren."

    InformationsquelleAutor j08691

  4. 0

    Kann mit Hilfe von css media queries und ändern Sie die Eigenschaft Werten, wenn die überlappung ist in der Tat.

    Oder verwenden Sie javascript, um zu testen, ob es überschneidungen gibt. Hier ist ein Ansatz u schrieb eines Tages: https://github.com/yckart/jquery.overlaps.js

    InformationsquelleAutor yckart

  5. 0

    Verwendung von CSS geben-Div Einen hohen Z-Index.

    #a{
  z-index: 100;  
}

    Dies bedeutet, dass Div A wird auf jeden Fall bleiben über alle/die meisten anderen Elemente, je höher der Wert, desto wahrscheinlicher wird es sein, über alles, je nachdem, wie viele andere Elemente auf der Seite. Wenn Sie brauchen mehr präzise überlappen Steuerung für mehrere Elemente weisen bestimmte z-index-Werte an den Elementen, die höher der Wert, desto weiter oben wird das element sein. Sie können auch minus-Werte.

    InformationsquelleAutor GeorgeV

  6. 0

    Hinweis: der z-index funktioniert nur auf positioniert Elemente (position:absolute, position:relative, oder position:fixed).

    <html>
  <div id="divA" style="width:100%; height:50px; z-index:2; position:fixed; background-color: red">
  </div>
  <div id="divB" style="width:100%; height:50px; z-index:1; position:absolute; top:30px; left:20px; background-color:green ">
  </div>
</html>

    divA wird kommen auf der Oberseite des divB jetzt(aufgrund der z-index-Eigenschaft). Aber stellen Sie sicher, um zu definieren, position Eigenschaft für divs. Das klappt nicht, wenn wir entfernen position: fixed für die divA.

    InformationsquelleAutor Srikanth

Schreibe einen Kommentar