我偶然发现了一个没有 js 或 html，只有 css 的包，它定义了一个可以在 html 中使用的自定义元素:
<status-indicator active pulse></status-indicator>
我看到的唯一声明是在 css 文件中:
status-indicator {
display: inline-block;
border-radius: 50%;
cursor: pointer;
width: var(--status-indicator-size);
height: var(--status-indicator-size);
background-color: var(--status-indicator-color);
}
这是包:https://www.npmjs.com/package/status-indicator
为了学习 - 谁能解释一下这是如何以及为什么有效或者我应该在哪里阅读它？
最佳答案
HTML允许自定义元素，有一些DOM hooks to interface with them 。建议在标签名称中使用连字符，这样它就不会与将来的 HTML 标签重叠。
正如您从 CSS 声明中看到的那样，没有什么是理所当然的。显示行为是显式定义的(默认是将未知元素视为内联文本，就像 <span> )。它还使用 CSS custom properties (variables) .
关于css - 在css中创建一个新的html元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/69540687/