css常用属性总结第二弹:id选择器

2024-04-16 14:21•css•阅读 2300

承接上一篇class选择器，这一篇我们来说说css的id选择器。

id选择器类似于类选择器，不过也有一些重要的差别，首先，id选择器前面有一个#号----称它为棋牌号吧，class为点号，用法就和class

选择器类似，基本用法如下：

#element{属性名：属性值}

我们来看一个列子吧：

<html>

<head>

#p1{color:red;font-weight:600;}

</style>

</head>

<body>

在浏览器里运行上面一段上面一段代码，就可以看到p元素的文字为加粗红色，看到了吧，id选择器用法就是这么简单。

不过我们知道，可以为多个元素指定相同的类名，但是对于id名，html文档中只能出现一个id名，所以我们得记住：保持id的唯一性。

不过有的人会说，如果一个html文档中出现了多个相同的id名会出现什么情况。实际上，浏览器通常不检查html中id的唯一性，这就意味着如果你在

html文档中设置了多个相同id属性值的元素，就可能为这些元素应用相同的样式.

如：

<html>

<head>

#same{color:red;font-weight:600;}

</style>

</head>

<body>

结果p元素和h4元素中的文字也是红色粗体，证明有相同id的元素都会有该样式，但这种用法是错误的，如果只是想让多个元素拥有相同样式，

请记住使用class属性！这里顺便提一下，多个相同id名会导致编写dom脚本变得困难。我们后面会提到的。

好了，今天的文章就到这里了，谢谢大家！