Das Attribut „Feste Position“ in CSS implementiert div centering_javascript-Fähigkeiten

Das Positionsattribut gibt den Positionierungstyp des Elements an. Dieses Attribut definiert den Positionierungsmechanismus, der zum Festlegen des Layouts des Elements verwendet wird. Jedes Element kann positioniert werden, aber absolute oder feste Elemente erzeugen eine Box auf Blockebene, unabhängig vom Typ des Elements selbst. Ein relativ positioniertes Element wird im normalen Fluss von seiner Standardposition versetzt.

Oben, unten, links, rechts, Mitte

div{
  position:fixed;
  margin:auto;
  left:0;
  right:0;
  top:0;
  bottom:0;
  width:200px;
  height:150px;
}

Wenn Sie nur eine Links- und Rechtszentrierung benötigen, löschen Sie unten:0 oder oben:0;

Wenn Sie nur die Ober- und Unterseite zentrieren müssen, verwenden Sie left:0 oder right:0;

Unten angehängt ist ein DIV-Element, das im Browserfenster zentriert ist

Eigentlich ist es nicht kompliziert, diesen Effekt zu erzielen, indem man die Positionspositionierung in CSS verwendet. Werfen wir einen Blick auf den Code:

<style type="text/css">
.dialog{
 position: fixed;
 _position:absolute;
 z-index:1;
 top: 50%;
 left: 50%;
 margin: -141px 0 0 -201px;
 width: 400px;
 height:280px;
 border:1px solid #CCC;
 line-height: 280px;
 text-align:center;
 font-size: 14px;
 background-color:#F4F4F4;
 overflow:hidden;
} 
</style>
<div class="dialog">我是在窗口正中央的，呵呵！</div>

Alle Einrichtungstipps finden Sie hier:

.dialog{
 position: fixed;
 _position:absolute; /* hack for IE6 */
 z-index:1;
 top: 50%;
 left: 50%;
 margin: -141px 0 0 -201px;
 width: 400px;
 height:280px;
 border:1px solid #CCC;
 line-height: 280px;
 text-align:center;
 font-size: 14px;
 background-color:#F4F4F4;
 overflow:hidden;
}

Position festlegen: fest; _position:absolut;

Links einstellen: 50 % und oben: 50 %;

Rand festlegen: -(DIV's offsetWidth/2) 0 0 -(DIV's offsetHeight/2)

Rendering

Der obige Inhalt ist die vollständige Beschreibung des festen Positionsattributs in CSS, das vom Herausgeber geteilt wird. Ich hoffe, es gefällt Ihnen.