在页面布局中,为了将页面元素合理有效地组织在一起,形成一套完整的、行之有效的原则和规范,称为【盒子模型】。
一般情况下,盒子占据的空间往往比单纯的内容要打,可以通过调整盒子的边框和边距等参数来调整盒子的位置和大小。
盒子模型是有内容content、边框border、内边距padding、外边距margin四部分组成。
内容区content拥有width、height和overflow三个属性。
width、height分别用于指定盒子内容区的宽度和高度。
overflow属性用于当content中的信息太多,并超出内容区所占的位置时,通过该属性来指定溢出内容的处理方式。
overflow属性取值:
1、visible:溢出的内容不会被修剪,呈现在元素框外。
2、hidden:溢出的内容将隐藏起来,不可见。
3、scroll:溢出的内容会被修剪,但可以通过滚动条查看隐藏的内容。
4、auto:由浏览器决定如何处理溢出部分,如果溢出部分被修剪,则可以通过滚动条查看隐藏的内容。
5、inherit:规定应该从父元素集成overflow属性的值。