檸檬影視劇2018-02-09 22:28:39

讓行內元素水平居中很簡單，直接用text-align：center；就可以了。但是要讓塊級元素水平居中，方法有很多，當然也看具體情況來用哪種方法，下面介紹一下，我常用的幾種方法。

1。margin：0 auto；

這個方法只能是元素在正常文件流中的時候才能用，如果用了其他的一些定位，脫離了正常文件流，那就不能用了。

2。position：absolute；left：50%；transform：translateX（-50%）；

這個是適用於絕對定位的場景

3。display：-webkit-box；-webkit-box-pack：center；

這個方法可以說效果是比較好的，當然這時你需要用box佈局

寒說吧2018-11-07 17:11:24

利用css讓頁面元素水平居中的方式有很多，下面簡單的介紹幾種實現方式，供大家參考：

外邊距（margin）

利用margin：0 auto來實現元素水平居中，具體實現，看下圖css程式碼：

絕對定位+margin-left

利用絕對定位（position）+margin-left來實現元素水平居中，看下圖css程式碼：

效果圖：

總結：

這兩種方式都是對塊級元素實現水平居中，如果是行內元素的話，可以使用屬性text-align：center；當然還有其他實現方式，這裡就不一一介紹了；

如有疑問，歡迎大家在評論下方留言討論。