装饰

1.1 文字对齐问题

场景：解决行内/行内块元素垂直对齐问题

问题：当图片和文字在一行中显示时，其实底部不是对齐的

1.2 垂直对齐方式

属性名：vertical-align

属性值：

2.1 光标类型

场景：设置鼠标光标在元素上时显示的样式

属性名：cursor

常见属性值：

 3.1 边框圆角

场景：让盒子四个角变得圆润，增加页面细节，提升用户体验

属性名：border-radius

常见取值：数字+px、百分比

赋值规则：从左上角开始赋值，然后顺时针赋值，没有赋值的看对角！

4.1 溢出部分显示效果

溢出部分：指的是盒子内容部分所超出盒子范围的区域

场景：控制内容溢出部分的显示效果，如：显示、隐藏、滚动条……

属性名：overflow

常见属性值：

 5.1 元素本身隐藏

场景：让某元素本身在屏幕中不可见。如：鼠标：hover之后元素隐藏

常见属性：

1. display: none 不占位隐藏

2. visibility: hidden 占位隐藏

（拓展）元素整体透明度

场景：让某元素整体（包括内容）一起变透明

属性名：opacity

属性值：0~1之间的数字

• 1：表示完全不透明
• 0：表示完全透明

注意点：

• opacity会让元素整体透明，包括里面的内容，如文字、子元素等……