表单标记建议,带有长“问题”文本的图例

Form markup advice, legend with long "question" text

提问人:Ally 提问时间:4/22/2011 更新时间:5/10/2011 访问量:151

问:

我正在创建一个在线调查问卷,并正在寻找一些关于标记最佳实践的建议。有些问题很长,它们来自第三方,无法更改。我目前有这样的它们:

<fieldset>
    <legend><span>Some long question text will go here?</span></legend>
    <input type="checkbox" name="opt1" id="opt1" value="opt1" /><label for="opt1">Option 1</label>
    <input type="checkbox" name="opt2" id="opt2" value="opt2" /><label for="opt2">Option 2</label>
    <input type="checkbox" name="opt3" id="opt3" value="opt3" /><label for="opt3">Option 3</label>
</fieldset>

这看起来还不错,还是有更方便的技术?感谢您的任何建议

XHTML 辅助功能 图例 字段集

评论

0赞 David Thomas 4/22/2011
对我来说看起来不错,这可能就是我自己做的方式;尽管我可能不会在 .spanlegend

答:

2赞 Francisc 4/23/2011 #1

是的,它是可访问的,但没有理由使用标签。<span>

评论

1赞 Will Martin 4/24/2011
另外需要注意的是,我通常将输入嵌套在标签标签中,因为这样您就可以在标签上设置 display: block,使其本身成为一行,无需进一步标记。即使以这种方式嵌套,我仍然建议使用 for/id 属性。
0赞 Terrill Thompson 5/10/2011 #2

是的,这是正确的可访问标记,但如果可能的话,要注意长元素。某些屏幕阅读器会读取字段集中每个输入的图例和标签。如果图例很长,对用户来说可能会非常麻烦。<legend>

还值得注意的是,在某些浏览器中,如果 long 不完全适合浏览器窗口的宽度,则不会换行。您可以通过使用 white-space:normal 设置图例的样式来控制这一点<legend>