جستجو  

آموزشهای HTML , آموزش HTMLقسمت هشتم


ليست ها

ليست ها در حال حاظر کاربرد بسيار گستردهاي در طراحي صفحات وب پيدا کرده اند در تکنيکهاي جديد طراحي صفحات وب از جمله JQUERY , CSS ليستها نقش بسيار مهمي دارند ( مخصوصا در ساخت منوها)

ليستها با استفاده از تگ هاي <li> <ol> <ul> در صفحات html وارد ميشوند و داراي چندين نوع هستند ليستها گاهي با عدد شماره گذاري ميشوند و گاهي با اشکالي ماننده دايره و مربع و... ( وگاهي بدون نشانه )

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

به طور مثال ::

 

<ul>
<li> www.internetstar.ir</li>
<li> www.phpnuke.ir  </li>
</ul>


  • www.internetstar.ir
  • www.phpnuke.ir
    <ol>
    <li> www.phpnuke.ir</li>
    <li> www.internetstar.ir</li>
    </ol>
  1. www.phpnuke.ir
  2. www.internetstar.ir

نحوه نمايش اين ليست ها در زير کد هاي انها مشخص شده است که در مثال اول با استفاده از اشکال نمايش داده شده است
در مثال دوم با عددها . در اين مثالها تگ <ul> و <ol> نشان دهنده ليست و تگ <li> نشان دهنده اجزاء اين ليست هستند نوع ديگري از ليست ها نيز وجود دارد که در زير با ذکر يک مثال به ان ميپردازيم



<html>
<body>
<dl>
    <td> www.internetstar.ir </td>
    <dd> وب سايت اينترنت استار  </dd>
    <dt> www.phpnuke.ir</td>
    <dd> مرجع نيوک فارسي </dd>
<dl>
</body>
</html>


در اين مثال تگ <dl> نشان دهنده ليست در صفحات HTML و تگ <dt> نشان دهنده اجزاء ليست و تگ هاي <dd> نشان دهنده توضيحاتي براي اجزاء ميباشد


style sheet چيست؟ نحوه استفاده از چگونه است؟

css يا همان style sheet ابزاري است براي قالب بندي و طراحي و کنترول اجزاي صفحات وب بدون استفاده از کد هاي HTML در اينجا به صورت کلي توضيحاتي در مورد style ها css و نحوه وارد کردن انها در صفحات HTML داده خواهد شد و در آينده به صورت کامل با اين کدها آشنا خواهيم شد

style sheet ها به سه روش در صفحات HTML مورد استفاده قرار ميگيرند .




  1. external style sheet
  2. internal style sheet
  3. inline style

external style sheet

استفاده از style ها به صورت صفحات بيروني به فرمت css اگر ميخواهيد براي تعداد زيادي از صفحات وب يک فرمت و style خاصي را تعريف کرد بهتر است از اين روش استفاده کنيم

از اين روش ميتوان براي کنترول تمامي اجزاي و تگهاي مورد استفاده در کليه صفحات يک وب سايت استفاده کرد به طوري که با وارد کردن اين style sheet در صفحات HTML يک وب سايت کليه صفحات به طور يکسان از style sheet استفاده ميکنند و به راحتي مي توان با اعمال تغييرات در اين سند کليه اجزاء و صفحات تشکيل دهنده يک وب سايت براي کنترول نمود

براي وارد نمودن صفحات css از سه روش زير استفاده مي نمائيم



<head>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>


internal style sheet

استفاده از تگ <style> براي وارد کردن style در صفحات HTML / اين روش براي نوشتن style هايي خاص براي صفحات به خصوص استفاده ميشود به اين معني که کدهاي css نوشته شده با اين روش فقط بر روي همان صفحه تاثير ميگذارد اين style ها با استفاده از تگ <style> در صفحات HTML وارد ميشوند و محل قرار گيري انها ما بين تگ <head> است


<head>
    <style type="text/css">
    body {background-color"yellow}
    p {color:blue}
</style>
</head>



inline style

استفاده از
style ها به صورت خطي و درون تگهاي HTML از اين روش براي دادن فرمت و style خاصي براي يک تگ HTML استفاده ميشود براي آشنايي با اين نوع style به مثال زير توجه کنيد




<p style="color:blue;margin-left:20px"> INTERNETSTAR.IR .</p>



در اين مثال font color و margin نگ <p></p> مورد نظر از سمت چپ با استفاده از دستور css تعيين شده است