关于css中auto的作用_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 12:17:05
Original
993 Leute haben es durchsucht

在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  然后右边为自动,左边也为自动,所以这个对象就在中间了。

你 你

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage