盒模型扩充
作者:互联网
-
边框盒(border-box):由border,padding,content组成
-
填充盒(padding-box):由padding,content组成
-
内容盒(content-box):由content组成
继承(inherit)
是指子元素会自动拥有父元素的某些CSS属性
继承须有传递性
-
文本类的样式都可以继承
一个元素的某个CSS属性,只有满足下面两个条件,才会继承父元素:
-
满足继承条件的
-
没有特别声明的元素
强制继承
-
强制继承,也叫显示继承,是指将CSS属性值设置为inherit
这样做由两个原因:
-
为了继承有些不可继承的属性
-
为了继承已被声明过的属性
溢出
-
overflow-y:scroll
超出内容显示可滚动区域(y轴可拉伸)
visible(显示)
hidden(隐藏);此标签还可以禁止外边距合并;消除浮动
scroll(滚动条显示)
auto哪个方向(x/y溢出,相应的方向出现滚动条)
段词规则
-
英文:空格,标点符号
-
中文:标点符号【空格】
-
数字:空格
书写格式为:
word-break:break-all;
不断词,按照占满宽度在换行
word-break:normal;
按照段词规则执行
引用背景图片
书写格式:
background-image: url(“图片地址”)
设置背景的区域
-
background-clip:背景颜色的剪切区域 取值:子盒子
-
background-origin:背景区域的渲染区域 取值:子盒子
普通盒模型与IE盒模型的区别
-
当设置元素宽高的时候(计算不同)
IE盒模型的适用场景
-
宽度给100%的基础上,又添加了其他盒子的尺寸
为了解决滚动条的问题,因此更改盒子的计算规则来实现效果
-
优点:不占像素
缺点:不可以分别使适用4个方向的值
标签:滚动条,继承,模型,元素,content,break,扩充,属性 来源: https://www.cnblogs.com/zy950203/p/14940082.html