admin 发表于 2020-12-5 11:44:14

【HTML】HTML <slot> 元素

摘自:https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/slot
HTML <slot> 元素 ,作为 Web Components 技术套件的一部分,是Web组件内的一个占位符。该占位符可以在后期使用自己的标记语言填充,这样您就可以创建单独的DOM树,并将它与其它的组件组合在一起。

Content categories      Flow content, phrasing content
Permitted content      Transparent
Events      slotchange
Tag omission      不允许,开始标签和结束标签都不能省略。
Permitted parents      Any element that accepts phrasing content
Permitted ARIA roles      None
DOM interface      HTMLSlotElement

<template id="element-details-template">
<style>
    details {font-family: "Open Sans Light", Helvetica, Arial, sans-serif }
    .name {font-weight: bold; color: #217ac0; font-size: 120% }
    h4 {
      margin: 10px 0 -8px 0;
      background: #217ac0;
      color: white;
      padding: 2px 6px;
      border: 1px solid #cee9f9;
      border-radius: 4px;
    }
    .attributes { margin-left: 22px; font-size: 90% }
    .attributes p { margin-left: 16px; font-style: italic }
</style>
<details>
    <summary>
      <code class="name"><<slot name="element-name">NEED NAME</slot>></code>
      <i class="desc"><slot name="description">NEED DESCRIPTION</slot></i>
    </summary>
    <div class="attributes">
      <h4>Attributes</h4>
      <slot name="attributes"><p>None</p></slot>
    </div>
</details>
<hr>
</template>
页: [1]
查看完整版本: 【HTML】HTML <slot> 元素