آموزش طراحی وب

لیست ها در HTML

در این جلسه ی آموزشی انواع لیست ها در html رو آموزش دادیم .

3-9

فصل سوم ( معرفی ساختار  HTML4 )

جلسه نهم ( لیست ها در HTML )

سلام خدمت همراهان عزیز مدرسه مجازی ایرانیان

دوستان امروز راجع به لیست ها در html صحبت می کنیم . ما سه نوع لیست داریم :

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

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

–         لیست های توضیحی

 لیست های مرتب

لیست های مرتب یا ordered list ، لیست هایی هستند که موارد به همراه شماره و یا حروف به ترتیب نمایش داده میشوند .برای ایجاد این لیست ها از عناصر ol و li استفاده می کنیم .

ساختار کلی :

 شمارشگر کنار هر عنوان رو میتونید از موارد زیر انتخاب کنید و در خاصیت type برای عنصر ol قرار دهید  :

۱-     اعداد

۲-     حروف انگلیسی بزرگ A

۳-     حروف انگلیسی کوچکa

۴-     حروف رومی بزرگ I

۵-     حروف رومی کوچک i

 به کدهای زیر دقت کنید ، به ترتیب برای هر مورد یک مثال میزنم :

 نتیجه ی کد بالا :

1

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

لیست های نامرتب یا Unordered list ، لیست هایی هستند که موارد به همراه bullet نمایش داده میشوند . برای ایجاد این لیست ها از عناصر ul و li استفاده می کنیم .

ساختار کلی :

 با استفاده از list-style-type  میتونید نوع bullet کنار عناوین رو تعیین کنید ، ۳ نوع bullet در زیر میبینید که میتونید یکی از این bullet هارو برای لیستتون انتخاب کنید :

–  Disc

–  Circle

–  Square

برای استفاده از bullet ها به کد زیر دقت کنید :

 نتیجه ی کد بالا :

2

اگر bullet های بالارو برای لیستتون نپسندیدید میتونید خودتون هر شکلی که میخواین به لیستتون اضافه کنید . برای اینکار باید برای هر li یک background تعیین کنید . به مثال زیر توجه کنید :

 نتیجه ی کد بالا :

bullet

تو کد بالا اگه دقت کرده باشید ، ما اومدیم bullet پیشفرض ul رو برابر با none قرار دادیم که خودمون یک bullet زیبا برای li هامون قرار بدیم . با این استایل دهی در بخش css بطور کامل آشنا خواهید شد .

لیست های توضیحی

لیست های توضیحی یا description list ، لیست هایی هستند که برای هر عنوان یک توضیح مختصر داده میشه .  برای این لیست ها از عناصر dl و dd و dt استفاده می کنیم .

ساختار کلی :

 نتیجه کد بالا :

4

خوب اطلاعات لازم در رابطه با لیست هارو در اختیار شما دوستان گرامی قرار دادم ، امیدوارم مفید واقع شده باشه .

تهیه شده در مدرسه مجازی ایرانیان

حسین همت یار

نویسنده در مدرسه مجازی ایرانیان ، دانشجوی رشته IT ، طراح وب و علاقه مند به تازه های دنیای اینترنت و وب و البته لینوکس

ثبت دیدگاه

آیا سوالی دارید؟

پنل کاربران

بستن
*
*

نظرسنجی

به کدام دسته موضوعی علاقه مند هستید؟

آخرین پرسش و پاسخ ها

اموزش تصادفی

خبرهای باحال دریافت کن

خبرهای باحال دریافت کن

ما هم مثل شما از دریافت ایمیل های مزاحم خوشمون نمیاد. فقط مطالب جدید و خبرهای ویژه رو به اطلاع شما میرسونیم. قول میدیم اسپم نکنیم :)

ثبت نام انجام شد ، لطفا ایمیلی که براتون ارسال میشه رو تایید کنین