HTML5 مقدماتی

آموزش HTML – آشنایی با لیست ها در HTML

آموزش HTML5
آموزش HTML5

آموزش HTML – آشنایی با لیست ها در HTML

لیست ها د HTML به دو حالت کلی تقسیم می شود .

  • لیست مرتب (ordered list)
  • لیست نامرتب (unordered list)

لیست مرتب (ordered list)
لیست های مرتب را با استفاده از تگ <ol> تعریف می کنند . در حالت کلی این لیست ها با اعداد نمایش داده می شوند. این اعداد می توانند اعداد انگلیسی ، یویانی باستان و یا حتی نقطه های ساده باشند.سبک این اعداد را با استفاده از css تغییر می دهند که در فصل های css آموزش خواهیم داد .

به یاد داشته باشید که هیچ محدودیت برای استفاده از لیست های مرتب و یا نا مرتب وجود ندارد.
توجه داشته باشید که اگر لیست شما دارای زیر لیست می باشد برای نمایش و تعریف زیر لیست ها باید از تگ <li> استفاده کنید.

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

آموزش HTML – آشنایی با لیست ها در HTML
آموزش HTML – آشنایی با لیست ها در HTML

صفت های مهم در لیست های مرتب

لازم به ذکر است برای ویرایش لیست ها از خاصیت list-style-type در css استفاده می کنند .
صفت شروع(start)
این صفت دارای یک مقدار عددی می باشد که عدد وارد شده در این صفت نشانه عدد شروع کننده ی لیست می باشد. به تیکه کد زیر دقت نمایید . با استفاده از صفت شروع لیست مورد نظر از عدد ۷ شروع می شود.

 نتیجه کد بالا به صورت زیر می باشد.

آموزش HTML – آشنایی با لیست ها در HTML
آموزش HTML – آشنایی با لیست ها در HTML

توجه داشته باشید که ممکن است لیست شما به جای عدد از حروف یونانی باستان و یا حروف استفاده کرده باشد، برای شروع کردن لیست از خانه های دیگر بازهم می توانید از صفت start استفاده کنید.
لیست نامرتب (unordered list)
لیست های مرتب را با استفاده از تگ <ul> تعریف می کنند. به طور معمول این نوع لیست دارای اعداد نیستند و با نقطه ، مربع، دایره، و دایره های تو خالی نمایش داده می شوند. سبک این نوع لیست را نیز با استفاده از css تغیر می دهند.

نتیجه ی کد بالا به صورت زیر می باشد .

آموزش HTML – آشنایی با لیست ها در HTML
آموزش HTML – آشنایی با لیست ها در HTML

لیست های توضیحاتی در html
لیست های توضیحاتی دارای نام و توضیحات می باشند به طوری که در این لیست ها نام وارد می شود و سپس توضیحاتی در مورد نام در نظر گرفته می شود. این لیست ها با استفاده از تگ <dl> تعریف می شوند. تگ dl مخفف description list (لیست توضیحات ) می باشد. همچنین تگ <dt> مخفف عبارت (define terms/names) می باشد. در آخر تگ <dd> برای نوشتن توضیحات برای هر عضو می باشد .

  نتیجه کد بالا به صورت زیر می باشد.

آموزش HTML – آشنایی با لیست ها در HTML
آموزش HTML – آشنایی با لیست ها در HTML

لیست های تو در تو در html
لیست های تو در تو در برخی از موارد بسیار کار آمد خواهند بود ، یکی از این موارد ساخت لیست های است که خود موارد لیست اصلی دارای زیر لیست باشد .

نکته : توجه داشته باشید که این نوع لیست ها می توانند شامل لیستهای مرتب و لیست های غیر مرتب باشند.

 نتیجه کد  بالا به صورت زیر نمایش داده میشود .

آموزش HTML – آشنایی با لیست ها در HTML
آموزش HTML – آشنایی با لیست ها در HTML

استفاده از لیست ها بستگی به انتخاب خود طراح و برنامه نویس دارد و اجباری از استفاده و یا استفاده نکردن از لیست خاصی نیست.

پیروز باشید، طراح باشی


پیروز باشید!
طراح باشی

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

طراح‌باشی

نوشتن دیدگاه

برای نوشتن دیدگاه کلیک کنید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

پربازدیدها