試一試
<p>
Salamanders are a group of amphibians with a lizard-like appearance, including
short legs and a tail in both larval and adult forms.
</p>
<aside>
<p>The Rough-skinned Newt defends itself with a deadly neurotoxin.</p>
</aside>
<p>
Several species of salamander inhabit the temperate rainforest of the Pacific
Northwest, including the Ensatina, the Northwestern Salamander and the
Rough-skinned Newt. Most salamanders are nocturnal, and hunt for insects,
worms and other small creatures.
</p>
aside {
width: 40%;
padding-left: 0.5rem;
margin-left: 0.5rem;
float: right;
box-shadow: inset 5px 0 5px -5px #29627e;
font-style: italic;
color: #29627e;
}
aside > p {
margin: 0.5rem;
}
屬性
此元素僅包含全域性屬性。
用法說明
- 不要使用
<aside>元素來標記括號中的文字,因為這類文字被認為是主流程的一部分。
示例
使用 <aside>
此示例使用 <aside> 來標記文章中的一個段落。該段落與文章的主要內容僅間接相關。
html
<article>
<p>
The Disney movie <cite>The Little Mermaid</cite> was first released to
theatres in 1989.
</p>
<aside>
<p>The movie earned $87 million during its initial release.</p>
</aside>
<p>More info about the movie…</p>
</article>
結果
技術摘要
| 內容類別 | 流程內容,區塊內容,可觸及內容。 |
|---|---|
| 允許內容 | 流內容. |
| 標籤省略 | 無,起始標籤和結束標籤都必須存在。 |
| 允許父級 | 任何接受 流程內容 的元素。請注意,<aside> 元素不能是 <address> 元素的後代。 |
| 隱式 ARIA 角色 |
complementary
|
| 允許的 ARIA 角色 |
feed, none, note, presentation, region, search |
| DOM 介面 | HTMLElement |
規範
| 規範 |
|---|
| HTML # the-aside-element |
瀏覽器相容性
載入中…