一 背景
1 背景重复
background-repeat:no-repeat|repeat-x|repeat-y
2 背景位置简写
background-position-x:横坐标方向的位置
background-position-y:纵坐标方向的位置
简写background-position: x y;
传参 top,right,bottom,left,center
3 背景简写
background:color image repeat position
背景颜色 ~图片 ~图片样式 ~图片的位置
4 背景吸附
- background-attachment:scroll|fixed;
scroll背景可以随屏幕滚动相对位置不变
fixed绝对位置不能变
5背景大小
background-size:x y; x -->width y -->height
cover -->会覆盖整个div 特点:只能以大覆小
二. 文本属性
1.文本对齐
text-align:left|center|right
2. 文本修饰
text-decoration:none|underline|overline|line-through
3.文本缩进
text-indent
4.文本转换
text-transfomr:uppercase|lowercase|capitalize
- lorem+tab 快速写出一段废话
三 字体属性
1 字体大小
font-size:+字体大小
- 最小的字体-->不要小于12px
2 字体样式
font-style:normal|italic
3 字体的权重
font-weight:bold|bolder|lighter
100-900
四. 表格
1.跨度
rowspan=" " 跨行
colspan=" " 跨列
2.轮廓
input{
margin-top: 50px;
outline: none;不为空选中会有轮廓效果;
}
3.透明度
opacity设置元素的透明度
4.表格折叠
border-collapse: collapse;重复折叠
继承
- 特殊 父元素不设置height,它会获取 子元素的height 一般都是子继承父
链接
1 访问效果
link -->没有访问的链接
visited -->已经访问过的链接
hover -->鼠标移入到链接上的状态
active -->鼠标点击的那一刻
tip:同时使用链接的这几种状态,顺序不打乱
2链接各种效果
- 清除下划线 text-decoration:none
- 颜色 直接设置
列表(样式是浏览器给的如果在边缘要加一个外边框)
未标题-2.jpg
- 列表样式
list-style:none; - 列表样式类型
list-style-type:disc点|circle圆|square - 列表样式图片
list-style-image
网友评论