Esta página ha sido traducida del inglés por la comunidad.Aprende más y únete a la comunidad de MDN Web Docs.
<slot>
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since enero de 2020.
El elemento HTML<slot> —parte de la suite tecnologicaWeb Components — es un placeholder en un componente que tu puedes llenar con tu propio marcado, que te permite crear árboles DOM por separado y presentarlos juntos.
| Categorias de contenido | Contenido de flujo,contenido de fraseo |
|---|---|
| Contenido permitido | Transparente |
| Eventos | [`slotchange`](/es/docs/Web/Reference/Events/slotchange) |
| Omisión de etiqueta | Ninguna, tanto la etiqueta inicial como la final son obligatorias. |
| Parentes permitidos | Cualquier elemento que aceptecontenido de fraseo |
| Rol ARIA implícito | No corresponding role |
| Roles ARIA Permitidos | No se permiterole |
| Interfaz DOM | HTMLSlotElement |
Atributos
Este elemento incluye losatributos globales.
nameEl nombre del slot.
Unslot nombrado es un elemento
<slot>con el atributoname.
Ejemplos
html
<template> <style> details { font-family: "Open Sans Light", Helvetica, Arial; } .name { font-weight: bold; color: #217ac0; font-size: 120%; } h4 { margin: 10px 0 -8px 0; } h4 span { background: #217ac0; padding: 2px 6px 2px 6px; } h4 span { border: 1px solid #cee9f9; border-radius: 4px; } h4 span { color: white; } .attributes { margin-left: 22px; font-size: 90%; } .attributes p { margin-left: 16px; font-style: italic; } </style> <details> <summary> <span> <code ><<slot name="element-name">NEED NAME</slot>></code > <i><slot name="description">NEED DESCRIPTION</slot></i> </span> </summary> <div> <h4><span>Attributes</span></h4> <slot name="attributes"><p>None</p></slot> </div> </details> <hr /></template>Nota:Puedes ver este ejemplo en accion enelement-details (velorunning live). Además, puedes encontrar una explicación enUsing templates and slots.
Especificaciones
| Specification |
|---|
| HTML # the-slot-element |
| DOM # shadow-tree-slots |