阿西河

所有教程

公众号
🌙
阿西河前端的公众号

我的收藏

    最近访问  (文章)

    教程列表

    数据库
    抓包专区
    测试专区

    HTML slot 标签

    HTML slot 功能

    HTML <slot> 元素 ,作为 Web Components 技术套件的一部分,是Web组件内的一个占位符。

    该占位符可以在后期使用自己的标记语言填充,这样您就可以创建单独的DOM树,并将它与其它的组件组合在一起。

    属性

    此元素有全局属性

    name

    插槽的名字

    拥有name属性的插槽叫具名插槽 。

    示例

    <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">&lt;<slot name="element-name">NEED NAME</slot>&gt;</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>
    

    属性

    <slot> 标签支持 HTML 全局属性

    事件属性

    <slot> 标签支持 HTML 事件属性

    卖前端学习教程

    只需几十元,就能买到培训班的内部教程!开启高薪之路!

    零基础小白阿里P7的教程都有!

    同时长期收购所有培训班的前端教程

    目录
    目录