CSS:实现水平居中的居中方案

73 阅读1分钟

普通流(inline元素):

行内元素要在父元素设置text-align:center才行 连接

普通流(block元素):

元素必须要有宽度,设置margin:0 auto;链接

浮动元素:

left:50%再transform偏移 链接

绝对定位

场景:有时候需要文字位置与文档无关,不占据任何位置,这时候会用绝对定位。

元素设置 position:absolute ,left和right设置为0,通过设置margin:0 auto实现居中。在知道宽度的情况下也可以设置left:50%,在通过设置transform偏移调整为居中。

链接