Html

|

لیست در Html

لیست ها یکی از پر استفاده ترین کدهای html هست که در طراحی وب بسیار نیاز و مورد استفاده است. از این رو در سری آموزش های Html میخواهیم بپردازیم به تگ های ایجاد کننده لیست در طراحی وب.

به طور کلی 2 نوع لیست داریم :

1.لیست های نا مرتب ordered

2.لیست های مرتب unordered

لیست های نامرتب

در لیست های نامرتب برای عناصر لیست از دایره توپر ، نقطه های توخالی ، مربع های توپر و ... مشخص می شوند. تگ ابتدایی و اغازین آن <ul> و تگ پایانی <ul/> است. برای جدا کردن هر لیست از تگ <li> استفاده میکنیم.

<ul>
<li/>بخش اول لیست<li>
<li/>بخش دوم لیست<li>
<li/>بخش سوم لیست<li>
<ul/>

مثال بالا یک لیست با مسخصه دایره تو پر به ما نشان میدهد.

لیست های نا مرتب

حال میتوانیم از شناسه type استفاده کنیم تا شکل علامت مشخص کننده لیستمون را تغییر بدیم.

Circle نقطه هایی تو خالی

Disc نقطه هایی تو پر

Square مربع های توپر

نکته: شناسه type را میتوان هم در <ul> به کار برد هم <li> با این تفاوت که زمانی که شما در ul به کار میبرید این علامت به تمام فسمت های لیست اختصاص داده می شود اما اگر برای li استفاده کنید تنها علامت همان سطر تغییر می کند.

<ul>
<"li type="circle>سطر اول لیست<li>
<"li type="disk>سطر دوم لیست<li>
<"li type="square>سطر سوم لیست<li>
<ul/>

لیست های نا مرتب

لیست های مرتب

لیست های مرتب هم مانند لیست های نا مرتب عمل می کند با این تفاوت که به جای <ul> از <ol> استفاده می کنیم.

<ol>
<li/>سطر اول لیست<li>
<li/>سطر دوم لیست<li>
<li/>سطر سوم لیست<li>
<ol/>

لیست های مرتب

حال برای کنترل کردن و راحتی کار در مورد ol از چند شناسه استفاده میکنیم.

شناسه start

در لیست های ol با استفاده از شناسه start مشخص میکنیم که اعداد از چه عددی شروع شوند.

<"ol start="4>
<li/>این سطر اول لیست است ولی شماره آن 4 است.<li>
<ol/>

لیست های مرتب 5

شناسه type

این شناسه هم همانند لیست های نامرتب نوع و شکل علامت قبل از سطر هر لیست را مشخص میکند.

"Type="1 لیست هایی با اعداد ریاضی

"Type="A لیست هایی با حروف برزگ انگلیسی

"Type="a لیست هایی با حروف کوچک انگلیسی

"Type="I لیست هایی با حروف بزرگ یونانی

"Type="i لیست هایی با خروف کوچک یونانی

این شناسه ها هم میتوانند در تگ ol استفاده شوند هم li و در این مورد مانند لیست های نامرتب عمل میکنند.

<ol>
<"li type="A>قسمت اول لیست<li>
<"li type="a>قسمت دوم لیست<li>
<"li type="1>قسمت سوم لیست<li>
<"li type="I>قسمت چهارم لیست<li>
<"li type="i>قسمت پنجم لیست<li>
<ol/>

ویرایش متن html آموزش html html

دریافت آخرین مطالب وبلاگ در کانال داتینه

بهاره شهسواری

بهاره شهسواری ، کارشناس نرم افزار هستم .
از سال 91 مشغول به یادگیری زبان های css ,html , javascript و jquery شدم
و از سال 93 به صورت اختصاصی به فعالیت در حوزه css و html پرداختم. علاوه بر کد نویسی به گرافیک هم علاقه مند هستم.

نظرات
نظر بدهید