کد HTML اجرای کد HTML به وسیله برنامه مرورگر (Browser)
فهرستها (Lists)  
مثالی بسيار ساده در مورد فهرستهای نامرتب  
<html>
<head>
<meta http-equiv="Content-Type" CONTENT="text/html; charset=utf-8">
</head>
<body>

<h4>An Unordered List:</h4>
<ul>
<li>Red</li>
<li>Blue</li>
<li>Green</li>
</ul>
</body>
</html>

An Unordered List:

  • Red
  • Blue
  • Green

 

مثالی در مورد فهرستهای مرتب و نحوه نمايش متون فارسی  
<html>
<head>
<meta http-equiv="Content-Type" CONTENT="text/html; charset=utf-8">
</head>
<body>

<h4 dir="rtl">فهرست مرتب:</h4>
<ol dir="rtl" >
<li>قهوه</li>
<li>شير</li>
<li>چای</li>
</ol>

<p dir="rtl">
شناسه dir و مقدار rtl سبب نمايش از راست به چپ تمامی اعضای فهرست خواهد شد.
</p>
</body>
</html>

فهرست مرتب:

  1. قهوه
  2. شير
  3. چای

شناسه dir و مقدار rtl سبب نمايش از راست به چپ تمامی اعضای فهرست خواهد شد.

فهرستهای مرتب و استفاده از شناسه type جهت تعيين نوع نمايش فهرست  
<html>
<head>
<meta http-equiv="Content-Type" CONTENT="text/html; charset=utf-8">
</head>
<body>
<h4 dir="rtl">حالتهای مختلف فهرستهای مرتب:</h4>
<p dir="rtl">کاربرد شناسه type تعيين شکل نمايش فهرست ميباشد.</p>
<h4>Numbered list:</h4>
<ol>
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>

<h4>Letters list:</h4>
<ol type="A">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>

<h4>Lowercase letters list:</h4>
<ol type="a">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>

<h4>Roman numbers list:</h4>
<ol type="I">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>

<h4>Lowercase Roman numbers list:</h4>
<ol type="i">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>
</body>
</html>

حالتهای مختلف فهرستهای مرتب:

کاربرد شناسه type تعيين شکل نمايش فهرست ميباشد.

Numbered list:

  1. Apples
  2. Bananas
  3. Lemons
  4. Oranges

Letters list:

  1. Apples
  2. Bananas
  3. Lemons
  4. Oranges

Lowercase letters list:

  1. Apples
  2. Bananas
  3. Lemons
  4. Oranges

Roman numbers list:

  1. Apples
  2. Bananas
  3. Lemons
  4. Oranges

Lowercase Roman numbers list:

  1. Apples
  2. Bananas
  3. Lemons
  4. Oranges
فهرستهای نامرتب و استفاده از شناسه type جهت تعيين نوع نمايش فهرست  
<html>
<head>
<meta http-equiv="Content-Type" CONTENT="text/html; charset=utf-8">
</head>
<body>
<h4 dir="rtl">حالتهای مختلف فهرستهای نامرتب:</h4>

<p dir="rtl">کاربرد شناسه type تعيين شکل نمايش فهرست ميباشد.</p>

<h4>Disc bullets list:</h4>
<ul type="disc">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ul>

<h4>Circle bullets list:</h4>
<ul type="circle">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ul>

<h4>Square bullets list:</h4>
<ul type="square">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ul>

</body>
</html>

حالتهای مختلف فهرستهای نامرتب:

کاربرد شناسه type تعيين شکل نمايش فهرست ميباشد.

Disc bullets list:

  • Apples
  • Bananas
  • Lemons
  • Oranges

Circle bullets list:

  • Apples
  • Bananas
  • Lemons
  • Oranges

Square bullets list:

  • Apples
  • Bananas
  • Lemons
  • Oranges
مثالی در مورد فهرستهای ترکيبی. اعضای فهرست ميتوانند از فهرستهای ديگر تشکيل شوند.  
<html>
<head>
<meta http-equiv="Content-Type" CONTENT="text/html; charset=utf-8">
</head>
<body>

<h4 dir="rtl">مثال فهرست ترکيبی فارسی:</h4>
<ol dir="rtl" >
<li>قهوه
<ul>
<li>قهوه ترک</li>
<li>قهوه کرد</li>
</ul>
</li>
<li>شير
<ul>
<li>پاکتی</li>
<li>آب</li>
<li>ژيان</li>
</ul>
</li>
<li>چای</li>
<li><a href="http://www.google.com/">Goole.com</a></li>
</ol>

<hr />

<h4>A nested List:</h4>
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea</li>
</ul>
</li>
<li>Milk</li>
</ul>

</body>
</html>

مثال فهرست ترکيبی فارسی:

  1. قهوه
    • قهوه ترک
    • قهوه کرد
  2. شير
    • پاکتی
    • آب
    • ژيان
  3. چای
  4. Goolge.com

A nested List:

  • Coffee
  • Tea
    • Black tea
    • Green tea
  • Milk
مثالی در مورد فهرستهای تعريفی به همراه استفاده از شناسه dir  
<html>
<head>
<meta http-equiv="Content-Type" CONTENT="text/html; charset=utf-8">
</head>
<body>

<h4 dir="rtl">فهرست تعريفی:</h4>
<dl dir="rtl" >
<dt >مقدمه</dt>
<dd>خلاصه ای از مقدمه</dd>
<dt>فصل 2</dt>
<dd>خلاصه ای از فصل 1</dd>
<dt>فصل 2</dt>
<dd>خلاصه ای از فصل 2</dd>
</dl>

<p dir="rtl">
شناسه dir و مقدار rtl سبب نمايش از راست به چپ تمامی اعضای فهرست خواهد شد.
</p>
</body>
</html>

فهرست تعريفی:

مقدمه
خلاصه ای از مقدمه
فصل 2
خلاصه ای از فصل 1
فصل 2
خلاصه ای از فصل 2

شناسه dir و مقدار rtl سبب نمايش از راست به چپ تمامی اعضای فهرست خواهد شد.




Copyright © 2003 - AVINY.COM - All Rights Reserved