بازدید امروز : 8
بازدید دیروز : 1
کل بازدید : 12113
کل یادداشتها ها : 11
------------------------------------------------------
اهداف :
1- معرفی انواع لیست ها
2- نحوه ی بکار بردن و اعمال تغییرات روی آن ها
لیست ها بخشی از نوشته می باشند که یا با عدد یا با بولت و هرچیز دیگری طبقه بندی و شماره گذاری می شوند و معمولا نسبت به نوشته ی اصلی عمق بیشتری دارند.
در HTML لیست ها را معمولا به سه دسته تقسیم می کنند:
1- لیست های شماره دار که به ترتیب عددی مرتب می شوند.
2- لیست های بولت که توسط یک دایره سیاه توپر نمایش داده می شود.
3- لیست های تعریفی که لیستی از لغات و معانی آنها می باشند.
لیست های شماره دار :
تگ آغازین و پایانی این نوع لیست ها <ol></ol> می باشد که به مرورگر می گوید این یک لیست شماره دار است و برای هر مورد از لیست هم از تگ <li></li> استفاده می کنیم.یعنی در واقع شکل عمومی به صورت زیر است:
<ol>
<li> مورد شماره 1</li>
<li> مورد شماره 2</li>
…
</ol>
لیست های بولت دار :
این نوع لیست هم دقیقا مانند لیست شماره دار است با این تفاوت که به جای تگ <ol> دارای تگ <ul> می باشند یعنی تگ آغاز و پایان عبارت است از : <ul></ul>
لیست های تعریفی:
این نوع لیست عمدتا برای نمایش لغت – معنی به کار برده می شوند هرچند طراحان از این نوع لیست برای ایجاد تورفتگی در متن هم استفاده می کنند. تگ این نوع لیست <dl> می باشد و موارد آن با تگ <dd> از یکدیگر تفریق داده می شوند.
نکته:شما می توانید حتی چند لیست را درون هم قرار دهید فقط توجه داشته باشید که به تعداد تگ های بازشده ، تگ های خاتمه را در جای مناسب قرار دهید.
برای تعیین نوع بولت هم می توانید از مشخصه ی type کمک بگیرید که مقادیری مثل circle ، disc ، square را در بر می گیرد (البته مقادیر دیگری هم دارد ولی این 3 تقریبا در تمام مرورگر ها شناخته شده می باشند). به عنوان مثال :
<ul type=”disc”>
<li> … </li>
</ul>
توجه کنید مشخصه ی type برای تگ <li> هم می تواند مورد استفاده قرار گیرد و زمانی این عمل را انجام می دهیم که قصد داشته باشیم یکی از موارد لیست را از بقیه جدا کنیم . دقت کنید که مقدار تعلق گرفته به مشخصه type در این مورد داخل کوتیشن ” ” نباشد.
<ul>
<li> … </li>
<li> … </li>
</ul>
مورد دیگری که به ندرت به آن احتیاج پیدا می کنید این است که می توانید یک لیست شماره دار را با هر عدد و یا حرفی و با مشخصه ی start شروع کنید. به عنوان مثال <ol start=”4”> لیست شماره داری ایجاد می کند که به جای 1 از 4 شروع می شود همچنین نقاط خاص را می توان با مشخصه ی value دوباره شماره گذاری کرد :
<li value=”7”>
توجه داشته باشید که همیشه همراه با مشخصه ی value و start از اعداد استفاده کنید . مثلا برای ایجاد یک لیست که با حرف d آغاز می شود باید این چنین تایپ کنید :
<ol type=”a” start=”4”>
برای نمایش شماره لیست به صورت اعداد یونانی هم از type=i استفاده می شود.
تمرین 1-4 :
نام اتومبیل های زیر را در یک لیست بولت دار و یک لیست شماره دار مرتب کنید و در صفحه ی وب نمایش دهید : BMW ، TVR ، Ferrari
تمرین 2-4 :
نام کشور های زیر را در یک لیست شماره دار و در ادامه ی لیست بالا قرار دهید به طوری که شماره ی اولین کشور با 4 شروع شود: آلمان ، ایالات متحده ، ایتالیا
تمرین 3-4 :
لیستی شامل 5 مورد تهیه کنید که بولت دار باشد و بولت مورد سوم شکلی متفاوت با بقیه ی بولت ها داشته باشد.
جواب ها:
پاسخ تمرین 1-4 :
<html><head><title>تمرین 1-4</title></head><body>
<ul>
<li> BMW</li>
<li> TVR</li>
<li> Ferrari</li>
</ul><br />
<ol>
<li> BMW</li>
<li> TVR</li>
<li> Ferrari</li>
</ol>
</body></html>
پاسخ تمرین 2-4:
<ol srart=”4”>
<li>آلمان</li>
<li>ایالات متحده</li>
<li>ایتالیا</li>
</ol>
پاسخ تمرین 3-4:
<ul>
<li> مورد اول </li><li> مورد دوم</li>
<li type=”desc”>مورد سوم</li><li>مورد چهارم</li>
<li>مورد پنجم </li>
</ul>
آموزش...