部分标签是否适用于分组表单元素？ [英] Is the section tag appropiate for grouping form elements?

问题描述

我目前使用p标签来围绕表单分组（例如标签，输入和错误信息）...

p标签是我用于年，但我遇到了一些问题，因为 p标签不能包含div等 ...所以我正在考虑使用'section'标签打破sections的形式:)。 ..

我在寻找一些反馈，如果你们认为在这种情况下使用这个标签在语义上/功能上是适当的......表单作为一个web dev是我一天的90％，所以真的很感谢你的想法和反馈：）

FYI（尽管无关紧要）我使用Laravel Form作为例子！

之前

 < p> ; 
< label>名字< / label> 
< input type =textname =first_namevalue ={{Form :: form_value（'first_name'，$ user）}}> 
< span class =error_message> {{$ errors-> first（'first_name'）}}< / span> 
< / p> 
 
< p> 
< label> Surame< / label> 
< input type =textname =surnamevalue ={{Form :: form_value（'surname'，$ user）}}> 
< span class =error_message> {{$ errors-> first（'surname'）}}< / span> 
< / p> 
  

strong>

 < section> 
< label>名字< / label> 
< input type =textname =first_namevalue ={{Form :: form_value（'first_name'，$ user）}}> 
< span class =error_message> {{$ errors-> first（'first_name'）}}< / span> 
< / section> 
 
< section> 
< label> Surame< / label> 
< input type =textname =surnamevalue ={{Form :: form_value（'surname'，$ user）}}> 
< span class =error_message> {{$ errors-> first（'surname'）}}< / span> 
< / section> 
  

感谢您的反馈 smile http://i2.minus.com/jOUK4SGJj8gGq.png

解决方案

section 元素 可以适用于分组表单元素，但当然不适用于每个输入+标签组。这是一个切分内容元素，这意味着每个部分都可以列在文档大纲。这很可能不是你想要的。

section 的一个很好的例子可能是 long /复杂形式，其中每个部分可能包含多个 fieldset 元素。一般来说，部分使用的经验法则是：

• 您应该使用<$如果您提供了一个标题（ h1 - h6 ），c $ c> section 内容; 如果为内容提供标题是适当的，则可以使用部分，但是由于某些原因，您不能这样做。

p 元素适用于将一个或多个输入+标签组分组为示例1中的第二个片段a>显示。由于您希望包含可能的错误消息，因此为该组使用（无意义的） div 元素，并将 p 元素用作孩子，似乎是合适的：

$ b

 < div> 
< p> 
< label>名字< / label> 
< input type =textname =first_namevalue => 
< / p> 
< p class =error_message>< / p> 
< / div> 
  

I'm currently using p tags to surround form groupings (e.g. label, input and error message)...

p tags are what I've used for years but I'm having a bit of an issue as p tags cannot contains divs etc... so I'm considering using the 'section' tag to break up the form "sections" :)...

I'm look for some feedback if u guys think the use of this tag in this context is semantically/functionally appropriate... Forms for me as a web dev are 90% of my day so Really appreciate your thoughts and feedback :)

FYI (though inconsequential) I'm using Laravel Form for the examples!

Before

<p>
    <label>First Name</label>
    <input type="text" name="first_name" value="{{ Form::form_value('first_name', $user) }}">
    <span class="error_message">{{ $errors->first('first_name') }}</span>
</p>

<p>
    <label>Surame</label>
    <input type="text" name="surname" value="{{ Form::form_value('surname', $user) }}">
    <span class="error_message">{{ $errors->first('surname') }}</span>
</p>

After

<section>
    <label>First Name</label>
    <input type="text" name="first_name" value="{{ Form::form_value('first_name', $user) }}">
    <span class="error_message">{{ $errors->first('first_name') }}</span>
</section>

<section>
    <label>Surame</label>
    <input type="text" name="surname" value="{{ Form::form_value('surname', $user) }}">
    <span class="error_message">{{ $errors->first('surname') }}</span>
</section>

Thanks for your feedback smile http://i2.minus.com/jOUK4SGJj8gGq.png

解决方案

The section element can be appropriate for grouping form elements, but certainly not for every input+label group. It’s a sectioning content element, which means that each section could be listed in the document’s outline. This is most likely not what you want.

A good case for section could be very long/complex forms, where each section possibly contains multiple fieldset elements. A rule of thumb for section use in general:

• you should use section if you provide a heading (h1-h6) for the content;
• you could use section if it would be appropriate to provide a heading for the content, but you don’t for some reason.

The p element is appropriate for grouping one or more input+label groups, as the second snippet in example 1 shows. As you want to include possible error messages, using a (meaningless) div element for the group, with p elements as children, seems to be appropriate:

<div>
  <p>
    <label>First Name</label>
    <input type="text" name="first_name" value="">
  </p>
  <p class="error_message"></p>
</div>

这篇关于部分标签是否适用于分组表单元素？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！