HTML тег <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>
<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>
Try it Yourself »
Більше прикладів "Спробуйте самі" далі.
Визначення та використання
Тег <aside> визначає певний вміст, окрім вмісту, у якому він розміщений.
Додатковий вміст має бути опосередковано пов’язаний із навколишнім вмістом.
Порада: Вміст <aside> часто розміщується як бічна панель у документі.
Примітка: Елемент <aside> не відображається як щось особливе у браузері. Однак ви можете використовувати CSS для стилізації елемента <aside> (див. приклад нижче).
Підтримка браузерами
Числа в таблиці вказують на першу версію браузера, яка повністю підтримує елемент.
| Елемент | |||||
|---|---|---|---|---|---|
| <aside> | 6.0 | 9.0 | 4.0 | 5.0 | 11.1 |
Глобальні атрибути
Тег <aside> також підтримує Глобальні атрибути HTML.
Атрибути подій
Тег <aside> також підтримує Атрибути подій в HTML.
Більше прикладів
Приклад
Використовуйте CSS для стилізації елемента <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>
Спробуйте самі »
Пов’язані сторінки
HTML DOM довідник: Об’єкт Aside
Налаштування CSS за замовчуванням
Більшість браузерів будуть відображати елемент <aside> з наступними значеннями за замовчуванням:
aside {
display: block;
}
