类和id区别
- 类选择器:class=“c1”,可以有多个属性
- id选择器:唯一性
书写区别
- 类选择器:以.开头
- id选择器:以#开头
使用环境
- 一般用类选择器比较多
- id选择器一般和JS开发集合使用
通配符选择器
*{}找到页面中所有的标签,设置样式
字体大小
font-size:尽量偶数,默认16px
字体粗细
font-weight
字体样式
font-style
字体
font-family,可以写多个备用,中间用逗号隔开
复合写法
font:style weight size family 同时设置单写和连写的形式,要把单写的样式写在连写的下面
首行缩进
text-indent:32px或者2em
文本居中
- text-align:right
- text-align给文本所在标签设置(文本父元素)
- line-height垂直方向居中
交集选择器
作用:选中页面中同时满足多个选择器的标签
标签选择器必须在最前面
p.active无空格
伪类
a:link {
color: blue;
}
/* 链接访问之后 */
a:visited {
color: aqua;
}
/* 鼠标放到标签上时 */
a:hover {
color: brown;
}
/* 被激活 鼠标点击 不松手 */
a:active {
color: chartreuse;
}
/*
4个伪类同时应用于a标签时要注意顺序问题
hover要放到link 和visited的后面
active要放到hover的后面
*/
h3:hover {
background-color: aquamarine;
color: brown;
}
/* 鼠标点击 不松开 */
h3:active {
color: chartreuse;
}
/* 了解 */
input:focus {
background-color: cornflowerblue;
}