CSS元素的width和水平margin的设置
2016-04-05 15:39
591 查看
如果没有设置box-sizing为其他值,元素默认的width是指其content box的宽度。
只有width,height和margin可以设置为auto,padding和border必须设定为具体的值,或者默认值是0
1. 在width,margin-left和margin-right这3个属性中,如果其中某个值为auto,另外两个设定为具体的值,那么设定为auto的属性会自动确定其具体值,以满足整个element box的宽度等于其containing box的width
2. 如果这3个属性全部设置为具体值,没有谁设置为auto,那么浏览器会把margin-right的值重置为auto,所以就又回到上面1的情形
3. 如果width设置为具体值,margin-left和margin-right设置为auto,那这两个margin会平分剩下的宽度,取得相同的值,结果就是该element会在其containing box里面居中
4. 如果其中一个margin设置为具体值,width和另一个margin设置为auto,那么设置为auto的这个margin会被浏览器重置为0,width会取得剩下的全部宽度
5. 如果这3个属性全部设置为auto,那么两个margin都会被浏览器重置为0,width会占满所有的宽度。也就是回到默认的情况。(width默认值是auto,所有的margin,padding,border默认是0)
只有width,height和margin可以设置为auto,padding和border必须设定为具体的值,或者默认值是0
1. 在width,margin-left和margin-right这3个属性中,如果其中某个值为auto,另外两个设定为具体的值,那么设定为auto的属性会自动确定其具体值,以满足整个element box的宽度等于其containing box的width
2. 如果这3个属性全部设置为具体值,没有谁设置为auto,那么浏览器会把margin-right的值重置为auto,所以就又回到上面1的情形
3. 如果width设置为具体值,margin-left和margin-right设置为auto,那这两个margin会平分剩下的宽度,取得相同的值,结果就是该element会在其containing box里面居中
4. 如果其中一个margin设置为具体值,width和另一个margin设置为auto,那么设置为auto的这个margin会被浏览器重置为0,width会取得剩下的全部宽度
5. 如果这3个属性全部设置为auto,那么两个margin都会被浏览器重置为0,width会占满所有的宽度。也就是回到默认的情况。(width默认值是auto,所有的margin,padding,border默认是0)
相关文章推荐
- Web布局连载——两栏固定布局(五)
- [div+css]晒晒最新制作专题推广页模板
- 盒子模型
- CSS选择器
- CSS样式优先权
- [css] line-height 百分比单位和数值单位的区别
- Apple官网研究之使用Justify布局导航
- 设计更快的网页(三):字体和 CSS 调整
- 纯CSS制作的新闻网站中的文章列表
- 10条影响CSS渲染速度的写法与使用建议第1/3页
- BS项目中的CSS架构_仅加载自己需要的CSS
- 很不错的 CSS Hack 又学了一招
- 发一个css比较清爽的写法
- CSS expression控制图片自动缩放效果代码[兼容 IE,Firefox]
- css布局网页水平居中常用方法
- CSS经典技巧十则第1/2页
- css 兼容性问题this.style.cursor=''hand''
- IE6不能正常解析CSS文件问题的解决方法及原因分析
- 欲练CSS ,必先解决IE的一些细节分析
- CSS文字截取功能实现代码