元素的显示与隐藏
1、 Display
属性 | 描述 |
none | 隐藏对象 |
block | 变为块级元素显示 |
inline | 内联对象的默认值 |
注:Display隐藏元素后不占有位置
2、 Visibility
属性 | 描述 |
visible | 元素可视 |
hidden | 元素隐藏 |
注:元素隐藏后仍占有原来的位置
3、 Overflow
用于指定如果内容溢出一个元素的框,会发生什么
属性 | 描述 |
visible | 不剪切内容也不添加滚动条 |
hidden | 不显示超过对象尺寸的内容,超出的添加滚动条 |
scroll | 不管超出内容与否都添加滚动条 |
auto | 超出自动显示滚动条,不超出不显示 |
一般情况下,有定位的盒子慎用overflow,他会隐藏多余部分
Css三角
宽高为零,指定边框,在指定颜色
Css用户界面样式
1、鼠标样式cursor
代码登录后可见
属性 | 描述 |
default | 小白默认 |
pointer | 小手 |
move | 移动 |
text | 文本 |
not-allowed | 禁止 |
2、轮廓线outline
给表单一个 outlline:none/0; 可去掉默认蓝色边框
3、防止拖拽文本域resize
代码登录后可见
经常设置图片或表单(行内块元素)和文字垂直对齐
属性 描述
baseline 元素放在父元素基线上
top 把元素的顶端与行中最高元素的顶端对齐
middle 把元素放在父元素的中部
bottom 把元素的顶端与行中最低的元素的顶端对齐
解决图片底部默认空白缝隙的问题
1、给图片添加 Vertical-align:middle/top/bottom
2、把图片转化为块级元素 display:block
Css特性
1、 属性选择器 权重为10
代码登录后可见
2、 结构伪类选择器
根据文档结构(根据父选择器里面子元素)
代码登录后可见
3、 伪类选择器
利用css创建标签元素,更简单,不需HTML标签
代码登录后可见
注:before和after创建一个元素,属于行内元素
新建的元素在文档树中找不到,称为伪元素
语法:
代码登录后可见
Before和after必须有content属性,伪元素选择器与标签选择器一样,权重为1