XHTML w3c 验证错误“引用不存在的 ID“xxxxx””

Question

对于这部分代码

<label for="gender">I am:</label>
<select class="select" name="sex" id="sex">
  <option value="0">Gender:</option>
  <option value="1">Female</option>
  <option value="2">Male</option>
</select>

W3C 验证器给出此错误引用不存在的 ID“性别”

如何解决？

编辑

也到这里

引用不存在的 ID“生日”

<label for="birthday" class="birthday">Birthday:</label>

<div class="field_container"> 

<select name="birthday_month" id="birthday_month" class="">
<option value="-1">Month:</option>
<option value="1">Jan</option>
<option value="2">Feb</option>
<option value="3">Mar</option>
</select> 
<select id="birthday_day" name="birthday_day">
<option value="-1">Day:</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<select id="birthday_year" name="birthday_year">
<option value="-1">Year:</option>
<option value="2010">2010</option>
<option value="2009">2009</option>
<option value="2008">2008</option>

</select>
</div>

Answer 1

更改label元素中for属性的值：

<label for="sex">I am:</label>

编辑添加：

您的第二个示例更复杂，因为您将一个标签用于三个输入字段。

我建议如下：

将以下 CSS 规则添加到您的网站：

.hidden_label {
  font-size:1px;
  height:0;
  line-height:0;
  margin:0 0 0 -1000px;
  text-indent:-9999px;
}

然后更新您的表单：

<div class="birthday">Birthday:</div>

<div class="field_container"> 

<label for="birthday_month" class="hidden_label">Birthday Month</label>
<select name="birthday_month" id="birthday_month" class="">
  <option value="-1">Month:</option>
  <option value="1">Jan</option>
  <option value="2">Feb</option>
  <option value="3">Mar</option>
</select> 

<label for="birthday_day" class="hidden_label">Birthday Day</label>
<select id="birthday_day" name="birthday_day">
  [...]
</select>

<label for="birthday_year" class="hidden_label">Birthday Year</label>
<select id="birthday_year" name="birthday_year">
  [...]
</select>

你想做两件事：

为您的用户提供一个视觉上吸引人的表单，然后为那些使用辅助技术的用户提供一些额外的帮助。使用我上面定义的 CSS 类，您可以确保屏幕阅读器在用户移动到表单元素时仍能看到元素并阅读其内容，同时从可视站点隐藏所有附加标签。

Answer 2

没有id="gender" 或name="gender"。你在使用性。要么使用性别，要么使用性别。保持一致。