لیست های HTML

لیست ها

رایج ترین لیست ها در html  لیستهای مرتب و لیستهای نامرتب هستند:

Ordered Lists

لیستهای مرتب با تگ <OL> شروع میشوند و عناصر  آن با تگ باز و بسته <li> از هم جدا میشوند. مثال زیر را در نظر بگیرید همانطور که مشاهده میکنید بعد از اجرا گرفتن با لیستی شماره گذاری شده که از ۱ به صورت صعودی رشد میکند مواجه میشویم، این شماره گذاری پیش فرض است. در ادامه مطلب با نوع های دیگر نیز آشنا میشویم:

  
 <html>
 <head>
 <title>ordered list</title>
 </head>
 <body>
 <ol>
 <li>اولین</li>
 <li>دومین</li>
 <li>سومین</li>
 </ol> 
 </body>
</html>

Capt548ure

Ordered List -خصوصیت type

توسط ویژگی type ما میتوانیم مقادیر دیگری برای شماری گذاری و مرتب کردن آیتم های لیست خود داشته باشیم

Type توضیح
type=”1″ آیتم های لیست با اعداد شماره گذاری میشوند(پیش فرض)
type=”A” آیتم های لیست با حروف بزرگ شماره گذاری میشوند
type=”a” آیتم های لیست با حروف کوچک شماره گذاری میشوند
type=”I” آیتم های لیست با حروف بزرگ رومی شماره گذاری میشوند
type=”i” آیتم های لیست با حروف کوچک رومی شماره گذاری میشوند
 <ol type="1|A|a|I|i">
 <li>اولین</li>
 <li>دومین</li>
 <li>سومین</li>
 </ol>

Unordered List

لیستهای نامرتب با تگ <ul>  شروع و عناصر آن با تگ باز و بسته <li>  از هم جدا میشوند. آیتم ها با دایره های تو پر به صورت پیش فرض علامت گذاری میشوند. شکلهای دیگری هم هست که با خصوصیت style میشود آنها را تغییر داد. در بخش css به آن میپردازیم.

 <html>
 <head>
 <title> Unordered List</title>
 </head> 
 <body>
 <ul>
 <li>avalin</li>
 <li>dovomin</li>
 <li>sevomin</li>
 </ul> 
 </body>
</html>

unre

لیستهای  توصیفی :(Description Lists)

در ادامه به لیستی دیگری به نام لیست توصیفی میپردازیم. لیست توصیفی، لیستی از عناصر با توضیح یا توصیفی برای هر عنصر میباشد. تگ <dl> لیست توصیفی را تعریف میکند، <dt> عناصر را تعریف میکند، <dd> توضیح هز عنصر را تعریف میکند:

 <html>
 <head>
 <title> Description Lists</title>
 </head> 
 <body>
<dl >
 <dt>Unordered List</dt>
 <dd>- The list items will be marked with bulle</dd>
 <dt>Ordered List</dt>
 <dd> - The list items will be marked with numb </dd>
</dl>
 </body>
</html>

58re


دیدگاهتان را بنویسید

We are glad you have chosen to leave a comment. Please keep in mind that comments are moderated according to our comment policy.