DEV Community

Cover image for HTML tags | slot
Carlos Espada
Carlos Espada

Posted on

HTML tags | slot

The <slot> HTML element —part of the Web Components technology suite— is a placeholder inside a web component that you can fill with your own markup, which lets you create separate DOM trees and present them together.

It defines a slot that is typically used in a shadow tree.

The name attribute is used to assign slots to other elements: a slot element with a name attribute creates a named slot to which any element is assigned if that element has a slot attribute whose value matches that name attribute's value, and the slot element is a child of the shadow tree whose root's host has that corresponding slot attribute value.

You can use the <template> and <slot> elements to create a flexible template that can then be used to populate the shadow DOM of a web component.

  • Type: -
  • Self-closing: No
  • Semantic value: No

Definition | Example | Support

Discussion (0)