Etiqueta HTML <aparte>


Ejemplo

Muestre algún contenido aparte del contenido en el que se encuentra:

<p>My family and I visited The Epcot center this summer. The weather was nice, and Epcot was amazing! I had a great summer together with my family!</p>

<aside>
<h4>Epcot Center</h4>
<p>Epcot is a theme park at Walt Disney World Resort featuring exciting attractions, international pavilions, award-winning fireworks and seasonal special events.</p>
</aside>

Más ejemplos de "Pruébelo usted mismo" a continuación.


Definición y uso

La <aside>etiqueta define algún contenido además del contenido en el que se coloca.

El contenido aparte debe estar indirectamente relacionado con el contenido circundante.

Sugerencia: el <aside>contenido a menudo se coloca como una barra lateral en un documento.

Nota: El <aside>elemento no se muestra como algo especial en un navegador. Sin embargo, puede usar CSS para diseñar el <aside> elemento (vea el ejemplo a continuación).


Compatibilidad con navegador

Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con el elemento.

Element
<aside> 6.0 9.0 4.0 5.0 11.1

Atributos globales

La <aside>etiqueta también es compatible con los atributos globales en HTML .


Atributos de eventos

La <aside>etiqueta también es compatible con los atributos de eventos en HTML .



Más ejemplos

Ejemplo

Usa CSS para diseñar el elemento <aside>:

<html>
<head>
<style>
aside {
  width: 30%;
  padding-left: 15px;
  margin-left: 15px;
  float: right;
  font-style: italic;
  background-color: lightgray;
}
</style>
</head>
<body>

<h1>The aside element</h1>

<p>My family and I visited The Epcot center this summer. The weather was nice, and Epcot was amazing! I had a great summer together with my family!</p>

<aside>
<p>The Epcot center is a theme park at Walt Disney World Resort featuring exciting attractions, international pavilions, award-winning fireworks and seasonal special events.</p>
</aside>

<p>My family and I visited The Epcot center this summer. The weather was nice, and Epcot was amazing! I had a great summer together with my family!</p>
<p>My family and I visited The Epcot center this summer. The weather was nice, and Epcot was amazing! I had a great summer together with my family!</p>

</body>
</html>

páginas relacionadas

Referencia HTML DOM: Objeto aparte


Configuración predeterminada de CSS

La mayoría de los navegadores mostrarán el <aside>elemento con los siguientes valores predeterminados:

aside {
  display: block;
}