支持 CSS :before 和 :after 伪元素的 html 元素列表

发布于 2024-12-23 02:29:58 字数 298 浏览 0 评论 0原文

我知道空元素中不支持 :before:after 伪元素,但是这些:

  • < code>

一个列表就好了!谢谢你们!

I know that the :before, and :after pseudo elements are not supported in empty elements, but what about these:

  • <select>
  • <option>
  • <textarea>
  • <button>

A list would be nice! Thanks guys!

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

执笏见 2024-12-30 02:29:58

我将每个 HTML 元素放在一起的列表。有些甚至在使用的地方都不合法……但它似乎仍然有效。

如果它以绿色字母显示“它有效”,则该元素受支持。

*:not(br):after {
  content: 'it works';
  font-weight: bold;
  padding: 5px;
  color: green;
}
<a>Name: a</a> <br />
<abbr>Name: abbr</abbr> <br />
<address>Name: address</address> <br />
<area>Name: area</area> <br />
<article>Name: article</article> <br />
<aside>Name: aside</aside> <br />
<audio>Name: audio</audio> <br />
<b>Name: b</b> <br />
<base>Name: base</base> <br />
<bdo>Name: bdo</bdo> <br />
<blockquote>Name: blockquote</blockquote> <br />

<body>Name: body</body> <br />
<br>Name: br</br> <br />
<button>Name: button</button> <br />
<canvas>Name: canvas</canvas> <br />
<caption>Name: caption</caption> <br />
<cite>Name: cite</cite> <br />
<code>Name: code</code> <br />
<col>Name: col</col> <br />
<colgroup>Name: colgroup</colgroup> <br />
<command>Name: command</command> <br />
<datalist>Name: datalist</datalist> <br />
<dd>Name: dd</dd> <br />
<del>Name: del</del> <br />
<details>Name: details</details> <br />
<dfn>Name: dfn</dfn> <br />
<div>Name: div</div> <br />
<dl>Name: dl</dl> <br />
<dt>Name: dt</dt> <br />
<em>Name: em</em> <br />
<embed>Name: embed</embed> <br />
<eventsource>Name: eventsource</eventsource> <br />
<fieldset>Name: fieldset</fieldset> <br />
<figcaption>Name: figcaption</figcaption> <br />
<figure>Name: figure</figure> <br />
<footer>Name: footer</footer> <br />
<form>Name: form</form> <br />
<h1>Name: h1</h1> <br />
<h2>Name: h2</h2> <br />
<h3>Name: h3</h3> <br />
<h4>Name: h4</h4> <br />
<h5>Name: h5</h5> <br />
<h6>Name: h6</h6> <br />

<head>Name: head</head> <br />
<header>Name: header</header> <br />
<hgroup>Name: hgroup</hgroup> <br />
<hr>Name: hr</hr> <br />
<html>Name: html</html> <br />
<i>Name: i</i> <br />
<iframe>Name: iframe</iframe> <br />
<img>Name: img</img> <br />
<input>Name: input</input> <br />
<ins>Name: ins</ins> <br />
<kbd>Name: kbd</kbd> <br />
<keygen>Name: keygen</keygen> <br />
<label>Name: label</label> <br />
<legend>Name: legend</legend> <br />
<li>Name: li</li> <br />
<link>Name: link</link> <br />
<mark>Name: mark</mark> <br />
<map>Name: map</map> <br />
<menu>Name: menu</menu> <br />
<meta>Name: meta</meta> <br />
<meter>Name: meter</meter> <br />
<nav>Name: nav</nav> <br />
<noscript>Name: noscript</noscript> <br />
<object>Name: object</object> <br />
<ol>Name: ol</ol> <br />
<optgroup>Name: optgroup</optgroup> <br />
<option>Name: option</option> <br />
<output>Name: output</output> <br />
<p>Name: p</p> <br />
<param>Name: param</param> <br />
<pre>Name: pre</pre> <br />
<progress>Name: progress</progress> <br />
<q>Name: q</q> <br />
<ruby>Name: ruby</ruby> <br />
<rp>Name: rp</rp> <br />
<rt>Name: rt</rt> <br />
<samp>Name: samp</samp> <br />
<script type="application/json">Name: script</script> <br />
<section>Name: section</section> <br />
<select>Name: select</select> <br />
<small>Name: small</small> <br />
<source>Name: source</source> <br />
<span>Name: span</span> <br />
<strong>Name: strong</strong> <br />
<style>Name: style</style> <br />
<sub>Name: sub</sub> <br />
<summary>Name: summary</summary> <br />
<details>Name: details</details> <br />
<sup>Name: sup</sup> <br />
<table>Name: table</table> <br />
<tbody>Name: tbody</tbody> <br />
<td>Name: td</td> <br />
<textarea>Name: textarea</textarea> <br />
<tfoot>Name: tfoot</tfoot> <br />
<th>Name: th</th> <br />
<thead>Name: thead</thead> <br />
<time>Name: time</time> <br />
<title>Name: title</title> <br />
<tr>Name: tr</tr> <br />
<ul>Name: ul</ul> <br />
<var>Name: var</var> <br />
<video>Name: video</video> <br />
<wbr>Name: wbr</wbr> <br />

I put together a list of every HTML element. Some aren't even legal where they're used... but it still seems to work.

If it says "it works" in green letters, that element is supported.

*:not(br):after {
  content: 'it works';
  font-weight: bold;
  padding: 5px;
  color: green;
}
<a>Name: a</a> <br />
<abbr>Name: abbr</abbr> <br />
<address>Name: address</address> <br />
<area>Name: area</area> <br />
<article>Name: article</article> <br />
<aside>Name: aside</aside> <br />
<audio>Name: audio</audio> <br />
<b>Name: b</b> <br />
<base>Name: base</base> <br />
<bdo>Name: bdo</bdo> <br />
<blockquote>Name: blockquote</blockquote> <br />

<body>Name: body</body> <br />
<br>Name: br</br> <br />
<button>Name: button</button> <br />
<canvas>Name: canvas</canvas> <br />
<caption>Name: caption</caption> <br />
<cite>Name: cite</cite> <br />
<code>Name: code</code> <br />
<col>Name: col</col> <br />
<colgroup>Name: colgroup</colgroup> <br />
<command>Name: command</command> <br />
<datalist>Name: datalist</datalist> <br />
<dd>Name: dd</dd> <br />
<del>Name: del</del> <br />
<details>Name: details</details> <br />
<dfn>Name: dfn</dfn> <br />
<div>Name: div</div> <br />
<dl>Name: dl</dl> <br />
<dt>Name: dt</dt> <br />
<em>Name: em</em> <br />
<embed>Name: embed</embed> <br />
<eventsource>Name: eventsource</eventsource> <br />
<fieldset>Name: fieldset</fieldset> <br />
<figcaption>Name: figcaption</figcaption> <br />
<figure>Name: figure</figure> <br />
<footer>Name: footer</footer> <br />
<form>Name: form</form> <br />
<h1>Name: h1</h1> <br />
<h2>Name: h2</h2> <br />
<h3>Name: h3</h3> <br />
<h4>Name: h4</h4> <br />
<h5>Name: h5</h5> <br />
<h6>Name: h6</h6> <br />

<head>Name: head</head> <br />
<header>Name: header</header> <br />
<hgroup>Name: hgroup</hgroup> <br />
<hr>Name: hr</hr> <br />
<html>Name: html</html> <br />
<i>Name: i</i> <br />
<iframe>Name: iframe</iframe> <br />
<img>Name: img</img> <br />
<input>Name: input</input> <br />
<ins>Name: ins</ins> <br />
<kbd>Name: kbd</kbd> <br />
<keygen>Name: keygen</keygen> <br />
<label>Name: label</label> <br />
<legend>Name: legend</legend> <br />
<li>Name: li</li> <br />
<link>Name: link</link> <br />
<mark>Name: mark</mark> <br />
<map>Name: map</map> <br />
<menu>Name: menu</menu> <br />
<meta>Name: meta</meta> <br />
<meter>Name: meter</meter> <br />
<nav>Name: nav</nav> <br />
<noscript>Name: noscript</noscript> <br />
<object>Name: object</object> <br />
<ol>Name: ol</ol> <br />
<optgroup>Name: optgroup</optgroup> <br />
<option>Name: option</option> <br />
<output>Name: output</output> <br />
<p>Name: p</p> <br />
<param>Name: param</param> <br />
<pre>Name: pre</pre> <br />
<progress>Name: progress</progress> <br />
<q>Name: q</q> <br />
<ruby>Name: ruby</ruby> <br />
<rp>Name: rp</rp> <br />
<rt>Name: rt</rt> <br />
<samp>Name: samp</samp> <br />
<script type="application/json">Name: script</script> <br />
<section>Name: section</section> <br />
<select>Name: select</select> <br />
<small>Name: small</small> <br />
<source>Name: source</source> <br />
<span>Name: span</span> <br />
<strong>Name: strong</strong> <br />
<style>Name: style</style> <br />
<sub>Name: sub</sub> <br />
<summary>Name: summary</summary> <br />
<details>Name: details</details> <br />
<sup>Name: sup</sup> <br />
<table>Name: table</table> <br />
<tbody>Name: tbody</tbody> <br />
<td>Name: td</td> <br />
<textarea>Name: textarea</textarea> <br />
<tfoot>Name: tfoot</tfoot> <br />
<th>Name: th</th> <br />
<thead>Name: thead</thead> <br />
<time>Name: time</time> <br />
<title>Name: title</title> <br />
<tr>Name: tr</tr> <br />
<ul>Name: ul</ul> <br />
<var>Name: var</var> <br />
<video>Name: video</video> <br />
<wbr>Name: wbr</wbr> <br />

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文