Heim  >  Artikel  >  Web-Frontend  >  Eine kurze Diskussion zur vertikalen und horizontalen Zentrierung in Bootstrap

Eine kurze Diskussion zur vertikalen und horizontalen Zentrierung in Bootstrap

青灯夜游
青灯夜游nach vorne
2021-01-04 17:34:5910710Durchsuche

Dieser Artikel stellt Ihnen die vertikale und horizontale Zentrierung von Bootstrap3 und Bootstrap4 vor. Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird für alle hilfreich sein. 🔜 vertikal:

Das Rastersystem von Bootstrap verwendet Float: Das Floating Bei der linken Methode funktioniert das Vertical-Alignment-Attribut nicht. Löschen Sie daher das Float-Attribut des internen Div und fügen Sie das Anzeigeattribut wie folgt hinzu: Eine kurze Diskussion zur vertikalen und horizontalen Zentrierung in Bootstrap

// 文本:

class ="text-center"

Bootstrap3-Anmeldefeld adaptive horizontale Zentrierung + vertikale Zentrierung

https://blog .csdn.net/shenzhen_zsw/article/details/75331515

Bootstrap4 So zentrieren Sie das Div vertikal:

Legen Sie die Höhe des Elements fest

// 图片居中:

class = "center-block"

Wenden Sie .align-items-center an, um das Element vertikal zu zentrieren:

//其他元素:

//bootstrap3水平居中:利用bootstrap列偏移

class = "col-md-offset-4 col-lg-offset-4col-xl-offset-4"
Anwenden . rechtfertigen. -content-center kann das Element horizontal zentrieren:

Weitere Programmierkenntnisse finden Sie unter:

Programmierlehre

! !

Das obige ist der detaillierte Inhalt vonEine kurze Diskussion zur vertikalen und horizontalen Zentrierung in Bootstrap. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:csdn.net. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen