تگ<ul> ليست نامرتب را معرفي ميكند . اجزاء ليست با تگ<li> معرفي مي شوند .اين اجزا بدون شماره وياترتيب خاصي ميباشند .براي معرفي ليست مرتب از تگ<ol> استفاده ميگردد.
مثال ـ نمونه ليست نامرتبHTML
<ul> <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ul>
تگ<ul> يك لست نامرتب يا گلوله دار HTML را تعريف ميكند .
براي ايجاد ليست نامرتب تگ فوق همراه تگ<li> مورد استفاده قرار ميگيرد .
نكته ـ براي استايل ليست ازCSS استفاده كنيد .
نكته ـ براي ايجاد ليست مرتب از<ol> استفاده كنيد.
Element | |||||
---|---|---|---|---|---|
<ul> | Yes | Yes | Yes | Yes | Yes |
تگ<ul> از ويژگي هاي جهانيHTML پيروي ميكند.
تگ فوق همچنين از ويژگي هاي رويدادي پيروي ميكند.
مثال ـ تنظيم استايل متفاوت براي ليست با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>
مثال ـ افزايش وكاهش ارتفاع خطوط ليست
<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>
مثال ـ ايجاد ليست در دل ليست ديگر
<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>
اغلب مرورگرها نمايش عنصر<ul> مطابق تنظيمات پيش فرضي زيرانجام ميدهند.
ul {
display: block;
list-style-type: disc;
margin-top: 1em;
margin-bottom: 1 em;
margin-left: 0;
margin-right: 0;
padding-left: 40px;
}