如何仅设置 html5 元素的样式？答案

【问题标题】：How to style html5 elements only?如何仅设置 html5 元素的样式？
【发布时间】：2014-02-19 15:19:22
【问题描述】：

html 标记可能有任何随机结构：

<div id="five">
  <main>test</main>
  <p>test</p>
  <div>test</div>
  <ul><li>test</li></ul>
  <article>test</article>
</div>

现在，我怎样才能只选择 html5 元素？

我想设置 id="five" only 的所有 html5 元素后代的样式，例如 padding: 0; font-size: 1.5em; 等，但其他元素应该包含它自己的 css。

我可以用逗号分隔标签编写所有 html5 元素，但方法太长了。

那么，有没有办法（单个选择器或选择器一次）仅使用 css 或 jQuery 选择 html5 元素？

在 jQuery 中如何只选择 html5 元素？

if($(this).prop('tagName') == html5) alert('you need latest browser to run');

【问题讨论】：

为每个 HTML5 标签使用一个公共类。并使用 JQUERY 选择它。
这里是在 html5 developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/… 中添加的所有元素的列表，您必须选择每个元素，例如'article, section, ...'
您似乎试图在旧版浏览器上使用 html5 元素？如果是这样，请尝试 html5 重置 stackoverflow.com/questions/3485720/…
如果您有更多 html5 元素，则将类附加到其他元素，或者创建除 html5 之外的其他 html 元素的数组。可能它很短！
所有元素都是 HTML 5 的一部分。也许您的意思是 与 HTML 4 相比 HTML 5 中的新元素？

标签： jquery css html

【解决方案1】：

我将创建一个具有以下继承的样式表：

 .html5 > article,
 .html5 > aside {
    display: block;
  }

并根据参考添加所有相关的 html 标签，然后使用 jquery 添加类或直接设置这些特定 html5 元素的样式。

【讨论】：

【解决方案2】：

建议使用单独的类，如Manish 参见下面的示例

<div id="five">
  <main class="html5">test</main>
  <p>test</p>
  <div>test</div>
  <ul><li>test</li></ul>
  <article class="html5">test</article>
</div>

并将 css 应用到 #five 中的那个类

#five .html5 {
  /*Add your css for html five element here*/

}

【讨论】：