1. background-image:可以放多个图片以逗号隔开,设置重复等属性的时候也需要写多个.
2.background-position:可以设置背景图片的位置,用俩个位置来确定例如:left top
3.text-indent:设置首行缩进,单位是em
4.text-decoration:underline下划线
5.text-decoration:overline 上划线
6.text-decoration:line-through删除线
7.margin:0 auto;居中
8.line-height:行高
9.text-align:文本位置
10.display:block 转换为块集元素:宽为整屏,高因内容变化可以不设置
11.display:inline 转换为行内元素(内联元素):不能设置宽高,大小因内容决定.
12.display:inline-block 转换为行内块元素,可以设置宽高,只占宽度或内容大小,可以并列显示。
13.overflow:hidden;超出部分隐藏。
14.white-space:nowrap;设置不换行.
15.text-overflow:ellipsis 文件超出部分用省略号.
16.line-height值为百分比的情况下,line-height写在那个标签上,他乘以的就是那个标签的字体大小。
17.line-height值为em的情况下,line-height写在那个标签上,他乘以的就是那个标签的字体大小。
18.line-height值没有单位的情况下,line-height乘以字体本身大小.
19.text-decoration 去文本样式,下划线,无序列表的点...。
20.伪类要按顺序写下来才有效 link visited hover active 点击之前,点击之后,鼠标移动上去,活动点击.
21.清楚浮动的方法:
(1)clear清楚浮动,需要添加额外的标签,页面赘余标签比较多,不实用
(2)overflow:hidden清除浮动(弊端:和定位一起使用,页面会发生异常)
(3)使用单伪元素:放置在浮动的父元素上边
选择器: :after{ 清楚后边的浮动
content:"" 增加标签内容
height:0px; 新增标签没有高度。
line-height:0px 新增标签没有高度
display:block 新增标签转化为块元素
visibility;hidden; 标签隐藏
clear:both; 清除浮动
}
选择器{
zoom:1;
}
(4)使用双伪元素:放置在浮动的父元素上边
.content:after,.content:after {(清除前后浮动)
content:""; 增加标签内容
display:block; 新增标签转化为块元素,或者直接写块元素
clear:both; 清除浮动
}
.content{
zoom:1; 兼容低版本浏览器
}
绝对定位 (离职)
position:absolute;
top:上
left:左
right:右
bottom:下
相对位置(父元素代指祖辈)
(1) 在没有父元素的时候,绝对位置是相对body来定位的
(2) 在有父元素的时候,父元素没有定位,绝对位置还是相对于body来定位的
(3) 在父元素有定位的时候,绝对位置是对于父元素的
相对定位(停薪留职)
position:relative;
位置:相对于他本身的位置,当发生相对定位后,本身元素位置不能被其他元素占据
俩者结合使用:子绝父相(父元素使用相对定位,子元素使用绝对定位)
固定位置
position:fixed;
固定在浏览器上. 例如广告等...
溢出
(1)overflow:hidden; 隐藏所有溢出部分
(2)overflow:scroll ;显滚动条(水平,垂直)
(3)overflow:auto; 显示滚动条,自动出现,比scroll智能
隐藏
display:none;隐藏之后,不占空间,相当于消失
visility:hidden 隐藏后的元素依旧占空间
display:block ;显示已经隐藏的html元素
visibility:visible 让元素显示
vertical-align:middle; 可以写百分比
该属性定义行内元素display:inline-block;基线与基线垂直对齐
标签的包含关系
内敛元素可以包含内敛元素
会计元素可以包含内敛元素,内敛元素不可以包含块级元素。
2.background-position:可以设置背景图片的位置,用俩个位置来确定例如:left top
3.text-indent:设置首行缩进,单位是em
4.text-decoration:underline下划线
5.text-decoration:overline 上划线
6.text-decoration:line-through删除线
7.margin:0 auto;居中
8.line-height:行高
9.text-align:文本位置
10.display:block 转换为块集元素:宽为整屏,高因内容变化可以不设置
11.display:inline 转换为行内元素(内联元素):不能设置宽高,大小因内容决定.
12.display:inline-block 转换为行内块元素,可以设置宽高,只占宽度或内容大小,可以并列显示。
13.overflow:hidden;超出部分隐藏。
14.white-space:nowrap;设置不换行.
15.text-overflow:ellipsis 文件超出部分用省略号.
16.line-height值为百分比的情况下,line-height写在那个标签上,他乘以的就是那个标签的字体大小。
17.line-height值为em的情况下,line-height写在那个标签上,他乘以的就是那个标签的字体大小。
18.line-height值没有单位的情况下,line-height乘以字体本身大小.
19.text-decoration 去文本样式,下划线,无序列表的点...。
20.伪类要按顺序写下来才有效 link visited hover active 点击之前,点击之后,鼠标移动上去,活动点击.
21.清楚浮动的方法:
(1)clear清楚浮动,需要添加额外的标签,页面赘余标签比较多,不实用
(2)overflow:hidden清除浮动(弊端:和定位一起使用,页面会发生异常)
(3)使用单伪元素:放置在浮动的父元素上边
选择器: :after{ 清楚后边的浮动
content:"" 增加标签内容
height:0px; 新增标签没有高度。
line-height:0px 新增标签没有高度
display:block 新增标签转化为块元素
visibility;hidden; 标签隐藏
clear:both; 清除浮动
}
选择器{
zoom:1;
}
(4)使用双伪元素:放置在浮动的父元素上边
.content:after,.content:after {(清除前后浮动)
content:""; 增加标签内容
display:block; 新增标签转化为块元素,或者直接写块元素
clear:both; 清除浮动
}
.content{
zoom:1; 兼容低版本浏览器
}
绝对定位 (离职)
position:absolute;
top:上
left:左
right:右
bottom:下
相对位置(父元素代指祖辈)
(1) 在没有父元素的时候,绝对位置是相对body来定位的
(2) 在有父元素的时候,父元素没有定位,绝对位置还是相对于body来定位的
(3) 在父元素有定位的时候,绝对位置是对于父元素的
相对定位(停薪留职)
position:relative;
位置:相对于他本身的位置,当发生相对定位后,本身元素位置不能被其他元素占据
俩者结合使用:子绝父相(父元素使用相对定位,子元素使用绝对定位)
固定位置
position:fixed;
固定在浏览器上. 例如广告等...
溢出
(1)overflow:hidden; 隐藏所有溢出部分
(2)overflow:scroll ;显滚动条(水平,垂直)
(3)overflow:auto; 显示滚动条,自动出现,比scroll智能
隐藏
display:none;隐藏之后,不占空间,相当于消失
visility:hidden 隐藏后的元素依旧占空间
display:block ;显示已经隐藏的html元素
visibility:visible 让元素显示
vertical-align:middle; 可以写百分比
该属性定义行内元素display:inline-block;基线与基线垂直对齐
标签的包含关系
内敛元素可以包含内敛元素
会计元素可以包含内敛元素,内敛元素不可以包含块级元素。