Heim > Web-Frontend > CSS-Tutorial > Wie mache ich ein Div mit CSS immer zentriert?

Wie mache ich ein Div mit CSS immer zentriert?

零下一度
Freigeben: 2017-05-12 13:59:40
Original
2300 Leute haben es durchsucht

Unabhängig davon, wie der Bildschirm verschoben wird, bleibt das p immer in der Mitte des Bildschirms (unterstützt IE7 (einschließlich IE7) und höher)

Der unten eingeführte einfache Code kann diese Funktion erreichen. Bitte kommen Sie vorbei und schauen Sie sich das an.

<p class="loginBox"></p>
Nach dem Login kopieren

Der CSS-Teil sollte so geschrieben sein:

.loginBox {
    background: #FA2;
    width: 700px;
    height: 400px;
    position: fixed;
    left: 50%;
    top: 50%;
    z-index: 11;
    /*设定这个p的margin-top的负值为自身的高度的一半,margin-left的值也是自身的宽度的一半的负值.*/ 
    /*宽为400,那么margin-top为-200px*/ 
    /*高为200那么margin-left为-100px;*/ 
    margin: -200px 0 0 -350px;
}
Nach dem Login kopieren

Nach dem Schreiben ist es so einfach, denken Sie nicht, dass es unerwartet ist?

【Verwandte Empfehlungen】

1. Kostenloses CSS-Online-Video-Tutorial

2. CSS-Online-Handbuch

3. php.cn Dugu Jiujian (2)-CSS-Video-Tutorial

Das obige ist der detaillierte Inhalt vonWie mache ich ein Div mit CSS immer zentriert?. 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