CSS不定宽元素如何居中?自适应宽度的元素需要使用另一种技术来实现居中。以下是几种方法:
1. text-align:center。
.container {
text-align:center;
}
.element {
display:inline-block;
} 2. flexbox。
.container {
display:flex;
justify-content:center;
}
.element {
flex:0 0 auto;
} 3. absolute和margin。
.container {
position:relative;
}
.element {
position:absolute;
left:50%;
transform:translateX(-50%);
} 4. table-cell。
.container {
display:table-cell;
vertical-align:middle;
text-align:center;
}
.element {
display:inline-block;
} 请注意,这些技术只能用于已知高度的元素。如果你不知道一个元素的高度,那么你必须使用JavaScript来确定它的高度并居中。