滚动条样式设置_CSS样式资料（五）

——零基础自学留存，仅作笔记使用，2019.3.27更！

1，元素的显示与隐藏：display、 visibility 和 overflow。

（1）display 显示：

display : none 隐藏对象，display:block 除了转换为块级元素之外，同时还有显示元素的意思。特点： 隐藏之后，不再保留位置。

（2）visibility 可见性：

visible : 　对象可视 ，hidden : 　对象隐藏。特点： 隐藏之后，继续保留原有位置。（停职留薪）

（3）overflow 溢出：设置当对象的内容超过其指定高度及宽度时如何管理内容。

visible : 　不剪切内容也不添加滚动条。

auto : 　 超出自动显示滚动条，不超出不显示滚动条

hidden : 　不显示超过对象尺寸的内容，超出的部分隐藏掉

scroll : 　不管超出内容否，总是显示滚动条

3，鼠标样式：设置在对象上移动的鼠标指针采用何种系统预定义的光标形状。

cursor : default 白箭头 | pointer 小手 | move 移动 | text 文本

4，轮廓线（outline）：一般写法，outline: 0; 或者 outline: none;

5，防止文本域拖拽（resize）：一般写法，resize：none；

6，垂直对齐（vertical-align）：通常用来控制图片/表单与文字的对齐。

（1）vertical-align：baseline ；文字和图片基线对齐。

（2）vertical-align：middle； 文字和图片中线对齐。（垂直居中）

（3）vertical-align：top；文字和图片顶线对齐。

默认的图片会和文字基线对齐。

注意：去除图片底侧空白缝隙，盒子的底线会和父级盒子的基线对齐。会导致图片底侧会有一个空白缝隙。

7，溢出的文字隐藏：

（1）word-break:自动换行

（2）white-space

（3）text-overflow 文字溢出

8，精灵图