Heim > Artikel > Web-Frontend > 关于css中auto的作用_html/css_WEB-ITnose
在css中有很多属性可以把值设定为auto,auto是自动的意思,但是这个自动值到底是什么?比如margin:auto是如何实现居中的?自动在这里到底是什么值?
你好:
实现居中的代码是这样的:#main{margin: 0 auto;}
原理是盒子模型的顺序,如果写完整的话是 #main{margin: 0 auto 0 auto;}
意思是:盒子的上下边距是0,左右是auto,这样,很简单就实现了盒子居中了。
auto就是根据浏览器的渲染而给她赋值。意思就是浏览器内置的值赋给它,或者是继承下来的值赋给它
auto在‘这里’是没有意义的
只有在实际使用的环境中才能讨论
反正来去就这么 几个地方 可以用 auto 每个试验下 就能理解 他的意思了
总之大胆试验吧
css渲染计算。
你好:
实现居中的代码是这样的:#main{margin: 0 auto;}
原理是盒子模型的顺序,如果写完整的话是 #main{margin: 0 auto 0 auto;}
意思是:盒子的上下边距是0,左右是auto,这样,很简单就实现了盒子居中了。
为什么左右时auto就自动居中了?浏览器是怎么处理auto的呢?
margin:0 10px 0 auto;
margin:0 auto 0 10px;
margin:0 auto 0 auto;
楼主试一下这三种在改变浏览器窗口大小情况下的显示就能明白
margin:上 右 下 左;
这里每一个位置都有对应的值的,用起来的标准是 margin:1px 1px 1px 1px; 这是代表上 右 下 左 四周的外补值都是 1px 。
也可以简写成 margin:1px 1px; 这样的写法意思是:第一个 1px 代表上和下, 第二个 1px 代表右和左;
如果四周的值都是一样的, 还可以简写成 margin:1px; 这样可以代表四周的值;
现在回到你的问题:居中的用法是 margin:0 auto; 这里明显就是代表,上下外补值为 0 然后右边为自动,左边也为自动,所以这个对象就在中间了。
你 你