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

از ویکی‌کد، دانشنامهٔ برنامه‌نویسی
< مرجع HTML:تگ‌ها(تغییرمسیر از تگ ul)
پرش به ناوبری پرش به جستجو
یک لیست نامرتب تعریف می‌کند
معرفی شده در نسخهٔ:۱
حذف شده در نسخهٔ: هنوز در حال استفاده است
ویژگی‌های مجاز:به پائین مراجعه کنید
تنظیمات پیش‌فرض CSS:به پائین مراجعه کنید

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

مثال

یک فهرست غیر ترتیبی اچ‌تی‌ام‌ال:

<ul>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>


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

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

برچسب <ul> یک فهرست غیر ترتیبی (گلوله‌ای) را تعریف می‌کند.[۱]

از برچسب <ul> همراه با برچسب <li> برای ایجاد فهرست‌های غیرترتیبی استفاده کنید.

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

عنصر Chrome Internet Explorer / Edge Firefox Safari Opera
<ul> بله بله بله بله بله

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

نکته: از CSS برای سبک‌دهی به فهرست‌ها استفاده کنید. در آموزش CSS ما: سبک‌دهی به فهرست‌ها بیشتر بخوانید.

نکته: برای ایجاد فهرست‌های مرتب، از برچسب <ol> استفاده کنید.

ویژگی‌های سراسری

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

ویژگی‌های رویداد

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

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

مثال

ارتفاع خط را در فهرست‌ها افزایش و کاهش دهید (با CSS):

<ul style="list-style-type:circle">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

<ul style="list-style-type:disc">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

<ul style="list-style-type:square">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>


مثال

نوع‌های مختلفی از سبک‌دهی به فهرست‌ها را تنظیم کنید (با CSS):

<ul style="line-height:180%">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

<ul style="line-height:80%">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>


در آموزش CSS ما شما می‌توانید جزئیات بیشتری دربارهٔ ویژگی نوع-سبک-فهرست (list-style-type) بیابید.

مثال

یک فهرست درون یک فهرست (یک فهرست تودرتو) دیگر ایجاد کنید:

<ul>
  <li>Coffee</li>
  <li>Tea
    <ul>
      <li>Black tea</li>
      <li>Green tea</li>
    </ul>
  </li>
  <li>Milk</li>
</ul>


مثال

یک فهرست تودرتوی پیچیده‌تر ایجاد کنید:

<ul>
  <li>Coffee</li>
  <li>Tea
    <ul>
      <li>Black tea</li>
      <li>Green tea
        <ul>
          <li>China</li>
          <li>Africa</li>
        </ul>
      </li>
    </ul>
  </li>
  <li>Milk</li>
</ul>


صفحات مرتبط

آموزش اچ‌تی‌ام‌ال: فهرست‌های اچ‌تی‌ام‌ال (HTML Lists)

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

آموزش CSS: سبک‌دهی به فهرست‌ها (Styling Lists)

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

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

مثال

ul {
  display: block;
  list-style-type: disc;
  margin-top: 1em;
  margin-bottom: 1 em;
  margin-left: 0;
  margin-right: 0;
  padding-left: 40px;
}


منابع آموزشی