Html 我们可以在选项元素中添加类属性吗?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/18438697/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 12:36:50  来源:igfitidea点击:

Can we add class attribute in option element?

htmlattributeshtml-select

提问by Ifan Iqbal

I want to add class for my option element. Is that valid to add class attribute in HTML option element?

我想为我的选项元素添加类。在 HTML 选项元素中添加 class 属性是否有效?

回答by Joum

Yes it is valid.

是的,它是有效的。

From the W3Schoolswebsite:

W3Schools网站:

The <option> tag also supports the Global Attributes in HTML.

From which the classattribute is a part of. Please note that often, the optiontag has formatting issues regarding the browser you are using, so styling it can be a little tricky.

从该class属性是的一部分。请注意,通常情况下,option标签存在与您使用的浏览器相关的格式问题,因此对其进行样式设置可能有点棘手。

EDIT:Since I wrote this answer, it has come to my attention that W3Schools probably isn't the most reliable sourceof goodinformation. The previous answer isn't at all wrong, but it came from a source that has proven to be somewhat inconsistent/incomplete. As such, I think I should also append a more officiallink to this subject here.

编辑:自从我写了这个答案,我注意到W3Schools 可能不是最可靠信息来源。先前的答案完全没有错,但它来自已被证明有些不一致/不完整的来源。因此,我认为我还应该在此处附加有关此主题的更官方链接。

回答by Jukka K. Korpela

The classattribute is valid for optionaccording to the relevant partof the HTML 4.01 Recommendation. The HTML5 drafts, including HTML5 CR, are even more permissive: they allow classliterally on any element.

根据HTML 4.01 Recommendation的相关部分,该class属性有效。HTML5的草案,其中包括HTML5 CR,甚至更宽容的:它们允许字面上的任何元素optionclass

My guess is that what you really wanted to ask was whether you can style some optionelements differently from others, using classattributes and CSS. Then the answer is that this depends on browser – not due to problems with recognizing classattributes but due to implementations of that are partly immune to CSS as regards to styling items in a dropdown list.

我的猜测是,您真正想问的是您是否可以option使用class属性和 CSS 为某些元素设置与其他元素不同的样式。那么答案是,这取决于浏览器——不是因为识别class属性的问题,而是因为在下拉列表中的样式项方面,它的实现部分不受 CSS 的影响。

回答by Abel Callejo

Yes!

是的!

In HTML it is valid to add a classattribute to an optionelement [1].

在 HTML 中,classoption元素添加属性是有效的[ 1]

However...

然而...

For CSS implicationsthough, the usability is limited. Especially when it comes to the optiontag because it is subject to the operating system's form control handlers [2]. This is the reason why code sample below will notactually work across all browsers.

但是,对于CSS 影响,可用性是有限的。特别是当涉及到option标签时,因为它受操作系统的表单控制处理程序[ 2] 的约束。这就是为什么下面的代码示例实际上不适用于所有浏览器的原因。

HTML
<select>
    <option>Centaur</option>
    <option class="colored">Unicorn</option>
</select>
CSS
.colored {
    background-image: url('my-colorful-background.png'); // e.g.: Apple doesn't recognize this rule
}

For JavaScript implications(w/jQuery), the usability is fully supported when it comes to the DOM objects but still bounded with the CSS implications as stated above. Thus, DOM-manipulation code like so... will work.

对于JavaScript 含义(w/jQuery),在涉及 DOM 对象时完全支持可用性,但仍受上述 CSS 含义的限制。因此,像这样的 DOM 操作代码......会起作用。

HTML
<select>
    <option>Centaur</option>
    <option class="colored">Unicorn</option>
</select>
JavaScript 与 jQuery
var label = jQuery('.colored').html();
console.log( label ); // outputs Unicorn

References

参考

  1. W3C- HTML 4.01 Specification, Forms, The SELECT, OPTGROUP, and OPTION elements
  2. MDN- Styling HTML forms, Why is it so hard to style form widgets with CSS?
  1. W3C- HTML 4.01 规范表单、SELECT、OPTGROUP 和 OPTION 元素
  2. MDN-样式化 HTML 表单,为什么使用 CSS 样式化表单小部件如此困难?

回答by Starx

Yes classbelongs to global attributes. Any element can have it.

Yesclass属于全局属性。任何元素都可以拥有它。

Source: http://www.w3.org/wiki/HTML/Attributes/_Global

来源:http: //www.w3.org/wiki/HTML/Attributes/_Global