50 کامل شده تا

برچسب <aside> در اچ‌تی‌ام‌ال

از ویکی‌کد، دانشنامهٔ برنامه‌نویسی
پرش به ناوبری پرش به جستجو
محتوا را جدا از محتوای صفحه تعریف می‌کند
معرفی شده در نسخهٔ:۵
حذف شده در نسخهٔ: هنوز در حال استفاده است
ویژگی‌های مجاز:به پائین مراجعه کنید
تنظیمات پیش‌فرض CSS:display: block;


{{منو اسکرول چپ|نام منو={{مرجع منو اچ‌تی‌ام‌ال|expanded=مرجع}}}}

مثال

محتوایی را جدای از محتوایی که قرار داده شده نمایش دهید:

<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>

مثال‌های بیش‌تری از «مشاهدهٔ نتیجه» در زیر.

تعریف و کاربرد

برچسب <aside> محتوایی را جدای از محتوایی که قرار داده شده نمایش می‌دهد.[۱]

محتوای کناری باید بطور غیرمستقیم با محتوای اصلی ارتباط داشته باشد.

نکته: عنصر <aside> بعنوان هیچ چیز خاصی در مرورگر رندر نمی‌شود. هرچند، شما می‌توانید از CSS برای سبک‌دهی به عنصر <aside> استفاده کنید (مثال زیر را ببینید).

پشتیبانی مرورگر

عددهای جدول، نخستین نسخهٔ مرورگر را که بطور کامل از عنصر پشتیبانی می‌کند مشخص کرده‌اند.

عنصر Chrome Internet Explorer / Edge Firefox Safari Opera
<aside> ۶٫۰ ۹٫۰ ۴٫۰ ۵٫۰ ۱۱٫۱

نکته‌ها و ملاحظات

نکته: محتوای <aside> (کناری) را می‌توان بعنوان یک نوار کناری در مقاله نمایش داد.

ویژگی های سراسری (Global Attributes)

همچنین برچسب <aside> از ویژگی‌های سراسری در اچ‌تی‌ام‌ال (Global Attributes in HTML) پشتیبانی می‌کند.

ویژگی های رویداد (Event Attributes)

همچنین برچسب <aside> از ویژگی‌های رویداد در اچ‌تی‌ام‌ال (Event Attributes in HTML) پشتیبانی می‌کند.

مثال‌های بیشتر

مثال

از CSS برای سبک‌دهی به عنصر <aside> استفاده کنید:

<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>

صفحات مرتبط

مرجع DOM اچ‌تی‌ام‌ال: شیء کناری (Aside Object)

تنظیمات پیش‌فرض CSS

بیش‌تر مرورگرها عنصر <aside> را با مقادیر پیش‌فرض زیر نمایش می‌دهند:

aside {
  display: block;
}


منابع آموزشی