当使用在单选按钮的参数了“标签”,以508兼容 *,是以下是否正确?
<label for="button one"><input type="radio" name="group1" id="r1" value="1" /> button one</label>
或者是这样吗?
<input type="radio" name="group1" id="r1" value="1" /><label for="button one"> button one</label>
原因我想问的是,在第二个例子中,“标签”只包含文本,而不是实际的单选按钮。
* 1973年康复法案第508节要求联邦机构提供软件和网站的无障碍残疾人士。
任一结构是有效的和可访问的,但for
属性应该等于id
输入元件的:
<input type="radio" ... id="r1" /><label for="r1">button text</label>
要么
<label for="r1"><input type="radio" ... id="r1" />button text</label>
在for
属性是第二个版本(含标签输入)可选的,但IIRC有一些旧版本浏览器并没有使标签文本点击,除非你包括它。 第一版本(输入后标签)是更容易风格使用相邻兄弟选择CSS +
:
input[type="radio"]:checked+label {font-weight:bold;}
(首先读出已经说明了其他的答案for
在<label></label>
标签。同时,双方顶部的答案是正确的,但对于我的挑战,它是当你有几个单选框,你应该为他们选择一个共同的名称,如name="r1"
,但不同的IDS id="r1_1" ... id="r1_2"
所以这样的答案更加清晰,并删除名称和ID之间的冲突也是如此。
您需要为单选框的不同选择不同的ID。
<input type="radio" name="r1" id="r1_1" /> <label for="r1_1">button text one</label> <br/> <input type="radio" name="r1" id="r1_2" /> <label for="r1_2">button text two</label> <br/> <input type="radio" name="r1" id="r1_3" /> <label for="r1_3">button text three</label>