版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
display
通过display样式可以修改元素的类型,可选值:
- inline : 可以将一个元素作为内联元素显示
- block : 可以将一个元素作为块元素显示
- inline-block : 将一个元素转换为行内块元素(可以使一个元素既有行内元素的特点又有块元素的特点,既可以设置宽高,又不会独占一行)
- none : 不显示元素,并且元素不会再页面中继续占有位置
visibility
用来设置元素的隐藏和显示状态
- visible 默认值 元素默认会在页面显示
- hidden 元素会隐藏,不显示(虽然不会在页面中显示,但是他的位置会依然保持)
overflow
子元素是默认存在于父元素的内容区中的,理论上讲子元素的大小最大可以等于父元素内容区的大小。如果子元素的大小超过了父元素的内容区,则超过的大小会在父元素以外的位置显示。超出父元素的内容,我们称为溢出,父元素默认是将溢出的内容,在父元素外边显示。
通过overflow可以设置如何处理溢出的内容
可选值:
- visible 默认值 不会对溢出的内容做任何处理,元素会在父元素以外的位置显示
- hidden 溢出的内容会被修建,不会被显示
- scroll 会为父元素添加滚动条,通过拖动滚动条来查看完整内容(该属性不论内容是否溢出,都会添加水平和垂直方向的滚动条)
- auto 会根据需求自动添加滚动条,需要水平就添加水平,需要垂直就添加垂直,不需要则不添加