水平居中设置这里的三种方法，还不怎么清楚。。。
也没有一个正确的书写模板看看
weibo_纠结的人儿请记得微笑_0
2016-11-05
2 回答
书写模板，例子就是比较好的吧。讲讲原理吧：
（1）水平居中最简单的情况的就是定宽元素，只要左右外边距为auto就可以了。（auto自动回左右边距相等，也就是居中了）。不过不定宽元素是不行的，所以第一种方法就是外面添加一个table标签（为什么是table标签讲的很清楚的，就是改为定宽。），然后左右margin auto就好了。
（2）首先将需要居中的块级元素的display属性设置为inline，这样的目的是先把块级元素变为行内元素，可以在一行内显示，然后将这些元素的父级元素text-align设置为：center即可。大概原理就是：块级->行内->居中(参照第1条方法)，不过缺点也很明显，块级元素的一些特点没有了，例如高度、宽度设置等。
（3）主要的思想也就是将所需要居中的父元素先float到左边，这样就能在一行内显示。然后相对定位，左移50%。这时候父元素最左边就在浏览器中间了。如果不对子元素进行处理，那么子元素的最左端就会像父元素一样在浏览器中间，左移再相对定位，向左移50%（子元素的50%）。这样子元素的中间线就和浏览器中间线一致了。试想子元素中线和浏览器中线一致了当然就居中了。
查看1条回复
举报
0/150
提交
取消
