CSS常用选择器

选择器:浏览器通过选择器为满足条件的HTML元素添加CSS样式:
标签选择器:
浏览器为HTML文档内标签名与标签选择器名相同的标签元素添加CSS样式,其语法如下:
标签选择器名 {
declaration1;
declaration2;

}
例如:

		b{
			font-size: 72px;
		}

类选择器:
浏览器为class标签属性的属性值与类选择器名相同的标签元素添加CSS样式,其语法如下:
. 类选择器名 {
declaration1;
declaration2;

}
例如:

		.u{
			color: red;
		}

注意:
class标签属性的属性值不能以数字开头;
class标签属性的属性值可以有多个,每个值之间用空格间隔;

id选择器:
浏览器为id标签属性的属性值与id选择器名相同的标签元素添加CSS样式,其语法如下
#id选择器名{
declaration1;
declaration2;

}

		#zzu{
			text-align: center;
			font-family: 'vladimir script'
		}

注意:
id标签属性的属性值不能以数字开头;
id标签属性的属性值在HTML文档中必须唯一;class标签属性的属性值可以不唯一;

后代选择器(descendant selector)又称为包含选择器,
用于为特定的HTML子元素添加CSS样式,语法如下:
父代选择器1 子父代选择器2 子父代选择器3 ….子代选择器 {
declaration1;
declaration2;

}
例如:

		html body #zzu{
			background-color: red;
		}

分组选择器:
如果HTML文档多个CSS样式表内的部分样式相同,则可以通过定义一个分组选择器以简化CSS样式代码, 该选择器的选择器名由多个选择器组成,使用逗号分隔,其语法如下:
选择器1,选择器2,选择器3…{
declaration1;
declaration2;

}
例如:

		#c,.u{
			color: red;
		}

通配符选择器:
通配符选择器匹配HTML文档中的任何HTML元素,其语法如下:
*{
declaration1;
declaration2;

}
例如:

		*{
			margin: 0px;
			padding: 0px;
		}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值