光标;圆角;溢出-第十七天
光标类型
场景:设置鼠标光标在元素上时显示的样式
属性名:cursor
常见属性值:
| 属性值 | 效果 |
|---|---|
| default | 默认值,通常是箭头 |
| pointer | 小手效果,提示用户可以点击 |
| text | 工字型,提示用户可以选择文字 |
| move | 十字光标,提示用户可以移动 |
| not-allowed | 禁止点击 |
| wait | 等待 |
圆角边框
场景:让盒子四个角变得圆润,增加页面细节,提升用户体验
属性名:border-ridius
常见取值:数字+px,百分百
赋值规则:从左上角开始赋值,人后顺时针赋值,没有赋值的看对角
圆形:盒子必须是圆形,在设置border-radius:50%或边长的一半
胶囊型:设置高度的一半
overflow溢出部分显示效果
溢出部分:指的是盒子内容部分所超出盒子范围的区域
场景:控制内容溢出部分的显示效果,如显示,隐藏,滚动条......
属性名:voerflow
常见属性值:
| 属性值 | 效果 |
|---|---|
| visible | 默认值,溢出部分可见 |
| hidden | 溢出部分隐藏 |
| scroll | 无论是否溢出,都显示滚动条 |
| auto | 根据是否溢出,自动显示或隐藏滚动条 |