web学习CSS4:盒子模型

2019-05-07  本文已影响0人  TDB

1.盒子模型概念

2.高和宽设置


max-width 和 min-width 在IE6不支持
max-height 和 min-height 在IE6不支持



3.边框设置

图片.png

        p{width: 400px;height: 100px;background-color: #ececec;line-height: 100px;
            border-top-width: 10px;border-top-color: blue;border-top-style:solid; }

缩写:


4.内边距设置


5.外边距设置


1.padding 不可以为负数,margin可以是负数
2.body和p标签默认margin为8
bodt,p{margin:0;}可以取消默认margin


margin:auto 相对于父试图 水平居中

6.盒子的计算


标准盒子模型


DCCTYPE 声明后,各个浏览器会通过标准盒子模型解析 HTML

7.元素显示方式



inline-block

内联元素呈现的时候,标签之间有缝隙。原因是标签之间有换行。
1.删除了就行。
2.设置父元素font-size为0,设置子元素font-size为16px

上一篇下一篇

猜你喜欢

热点阅读