补充样式
overflow
- 当子元素大小超过父元素内容区时,子元素会从父元素中溢出(overflow),在css通过overflow这个样式,来处理溢出内容
- 设置元素如何处理溢出内容
- 可选值
- visible 默认值 溢出内容直接在元素以外的位置显示
- hidden 隐藏溢出的内容
- scroll 生成双方向滚动条,通过滚动条来查看完整内容
- auto 根据需要生成滚动
display
- 用来设置元素的类型
- 可选值:
- inline 将元素设置为行内元素
- block 将元素设置为块元素
- inline-block 行内块元素
- 行内块兼具行内元素和块元素的特点
- 不独占一行,又可以设置宽高
- 注意:行内块的特点和文本很像,所以布局时少用
- none隐藏元素
visibility
- 用来设置一个元素的可见性
- 可选值:
- visible 默认值 元素可见
- hidden 元素是隐藏的在页面中不可见,但是依然占据页面的位置
- outline 轮廓线
- 和边框非常像,但是outline不会影响到元素可见框的大小
- border-radius 圆角
- box-shadow 可以用来为元素指定阴影
- 取值:
- box-shadow: x轴偏移量 y轴偏移量 模糊半径 扩散半径 阴影颜色
- 可以设置一个inset来表示内部阴影