id选择器


需求
“这是一则非常重要的新闻“,这段话它的字体和颜色和其他明显不一样,需要单独显示。


这时我们使用ID选择器

css文件:

/*id选择器*/
#style2 {
	font-size: 36;
	font-family: 楷体;
	background-color: #B3B3B3;
}

html文件:

<html>
	<head>
		<link rel="stylesheet" href="HtmlPage1.css" type="text/css"></link>
	</head>
	<body>
		<span class="style1">新闻1</span>
		<span class="style1">新闻2</span>
		<span class="style1">新闻3</span>
		<span class="style1">新闻4</span>
		<span class="style1">新闻5</span><br/>
		<span id="style2">这是一则重要的新闻</span>
	</body>
</html>

总结:

  • 优点: 可以对很特殊的元素进行单独的修饰
  • 缺点: 每次只能用一次,这样会导致页面的上HTML元素有过多的id属性(id滥用)
  • 细节: id的属性值必须唯一