Question

怎么理解在css中id选择器只能在文档中使用一次

例如在一个html中存在如下两个元素
<h1 id="a">This heading is very important.</h1>

<p id="a">This paragraph is very important.</p>
当我为这个id设定样式之后，比如#id {color：red}，这两个元素的文字都为红色，这我就搞不懂了，不是说在一个 HTML 文档中，ID 选择器会使用一次，而且仅一次吗，求解释

Answer 1

所谓ID只能用一次，指的是就像一个人对应一个身份证一样，是不能有重复一样的，那么也就是你的这个页面中，<h1 id="xx"></h1>这里面的xx只能成为一个元素的id而不能继续成为p元素的id,你这样写是有违语法规范的。而你理解错了，在于你以为是效果只能用一次，实际上是只能被一个元素所拥有。

你的页面上看到了两个元素都是红色，这就好比你的身份证本来是你唯一持有的，却被坏人复制了，那么你所拥有的红色属性，他也可以拥有了。一般而言，是以类名class来定义样式的，就好比，你可以去买一个杯子，别人也可以买一个杯子，你们买的杯子都是一起机器制作的，是可以一模一样的。

一般来说，我们都是用类来定义不同元素的样式的，而id更多的是用在对此元素有唯一的设定，不论是设定样式还是交互效果

追问

有没有明显的用用场景可以显示出二者的不同

追答

比如，你看一个新闻网页列表，下面有提示，上一页，下一页，虽然这两个按钮的样式一模一样，但是起的作用却不同，一个是为了返回看上一页内容，一个是为了看下一页内容，那么这种情况下，样式相同，我们可以给这两个按钮相同的类名，但是功能作用不同，所以，ID需要设为不同的。
css样式中：

.yangsi{width:100px;height:40px;border:none;background:blue;display:block;color:#fff}

html页面中：

上一页
下一页

js中，先引入jQuery
然后
$('#shangyiye').click(function(){
//点击上一页进行的动作
})
$('#xiayiye').click(function(){
//点击下一页进行的动作
})

Answer 2

来错吧，去CSS吧。––––––––––––––––Meine Kameraden, Ich liebe den Krieg!