CSS伪类选择器和CSS常用属性
2017-12-04 11:48
645 查看
1:CSS伪类选择器
1) 四种状态:
link:未访问过的状态 hover: 鼠标停留在上面的状态
active: 鼠标点击时的状态 visited: 访问过后的状态
2) 顺序:
如果想让四种状态一直可以使用,必须按照link visited hover active 这个顺序来排列.
2:CSS常用的属性:
1) 文本属性:
color:设置文本的颜色
letter-spacing:字符的间隔, word-spcing : 增加空格的间距,单词之间的间隔
text-decoration:属性值:overline underline none line-through
2) 字体属性:
font-style : 字体是否倾斜
font-weight: 字体加粗
font-size: 字体的大小
font-family: 字体的样式
简写模式: font: font-style font-weight font-size font-family
3) 背景属性:
background-color: 背景颜色
background-image: 设置背景图片 background-repeat: 图片重复的方式
background-position: 图片的位置: (top center buttom) (left center right)
4) 列表和表格
列表: list-style-type :none (先将默认的去掉)
list-style-image: url() 在将自定义的添加进去
表格:table : border-collapse: collapse
5) 边框属性:
border-width: 边框的宽度 border-style:solid double dashed(虚线) dotted(点) 边框的样式 border-color: 边框的颜色
边框每一个属性:上 右 下 左的顺序进行设置,如果那个边没有设置,则取对边.
6) 盒子模型:
div+css组成一个盒子,盒子的容量: 盒子的大小,width height 盒子的厚度: 边框的宽度 border-width
盒子的内边距: 内容和盒子边框的距离 padding 盒子的外边距: 盒子和盒子之间的距离 margin
盒子的定位: position : relative(相对于原来的位置) absolute(相对于父类的位置) fixed(相对于整个界面的位置,是固定的)
1) 四种状态:
link:未访问过的状态 hover: 鼠标停留在上面的状态
active: 鼠标点击时的状态 visited: 访问过后的状态
2) 顺序:
如果想让四种状态一直可以使用,必须按照link visited hover active 这个顺序来排列.
2:CSS常用的属性:
1) 文本属性:
color:设置文本的颜色
letter-spacing:字符的间隔, word-spcing : 增加空格的间距,单词之间的间隔
text-decoration:属性值:overline underline none line-through
2) 字体属性:
font-style : 字体是否倾斜
font-weight: 字体加粗
font-size: 字体的大小
font-family: 字体的样式
简写模式: font: font-style font-weight font-size font-family
3) 背景属性:
background-color: 背景颜色
background-image: 设置背景图片 background-repeat: 图片重复的方式
background-position: 图片的位置: (top center buttom) (left center right)
4) 列表和表格
列表: list-style-type :none (先将默认的去掉)
list-style-image: url() 在将自定义的添加进去
表格:table : border-collapse: collapse
5) 边框属性:
border-width: 边框的宽度 border-style:solid double dashed(虚线) dotted(点) 边框的样式 border-color: 边框的颜色
边框每一个属性:上 右 下 左的顺序进行设置,如果那个边没有设置,则取对边.
6) 盒子模型:
div+css组成一个盒子,盒子的容量: 盒子的大小,width height 盒子的厚度: 边框的宽度 border-width
盒子的内边距: 内容和盒子边框的距离 padding 盒子的外边距: 盒子和盒子之间的距离 margin
盒子的定位: position : relative(相对于原来的位置) absolute(相对于父类的位置) fixed(相对于整个界面的位置,是固定的)
相关文章推荐
- Css3之高级-1 Css复杂选择器(兄弟选择器 、属性选择器、伪类选择器、伪元素选择器)
- css实现面包屑导航与冒泡框(border属性与伪类选择器)
- CSS属性、伪类选择器,CSS3选择器
- [前端] CSS不常用的属性及选择器
- css对边框的属性控制和链接的伪类选择器
- CSS伪类选择器之属性选择
- 04-CSS常用选择器与属性
- CSS常用属性及选择器
- WEB前端-CSS-选择器&常用样式/属性
- CSS学习(二)-结构伪类选择器、属性选择器
- css中的一些常用选择器
- css入门知识:div和span,常用选择器,高级选择器
- CSS 3 伪类选择器
- CSS常用属性的代码简化实例
- 个人常用的css属性
- Css的filter常用滤波器属性及语句大全
- HTML+CSS布局(常用css控制属性)小结
- CSS的filter常用滤波器属性及语句大全
- 详解 CSS 属性 - 伪类和伪元素的区别
- css伪类选择器,:link、:visited、:focus、:hover、:active、:first-child