آموزش طراحي سايت - آموزش List
آموزش List
- < ul>- ليست بدون ترتيب. اين ليست آيتم ها را با استفاده از bullet هاي ساده ليست مي كند.
- < ol> - ليست منظم. اين ليست از نمودارهاي عددي مختلف براي ليست كردن آيتم هاي شما استفاده مي كند.
- < dl>- ليست تعريف. اين ليست آيتم هاي شما را به همان روشي كه در ديكشنري منظم شده اند، منظم مي كند.
ليست هاي بدون ترتيب HTML
ليست بدون ترتيب مجموعه اي از آيتم هاي مربوط به هم مي باشد كه هيچگونه نظم و ترتيب خاصي ندارند. اين ليست با استفاده از برچسب < ul> در HTML ايجاد مي شود. هر آيتم در ليست با يك bullet مشخص مي شود.
مثال:
نمونه يك
HTML Unordered List
- Beetroot
- Ginger
- Potato
- Radish
ويژگي type
مي توانيد از ويژگي type براي برچسب < ul> استفاده كنيد تا نوع bullet خود را مشخص كنيد، كه به طور پيش فرض يك ديسك مي باشد. در زير گزينه هاي ممكن را مشاهده مي كنيد.
<
ul
type
=
"square"
>
<
ul
type
=
"disc"
>
<
ul
type
=
"circle"
>
ul
>
ul
>
ul
>
نمونه دو
- Beetroot
- Ginger
- Potato
- Radish
در زير مثالي را مي بينيد كه در آن از < ul type="disc"> استفاده كرده ايم.
نمونه سه
HTML Unordered List
- Beetroot
- Ginger
- Potato
- Radish
در زير مثالي را مي بينيد كه در آن از < ul type="circle"> استفاده كرده ايم.
نمونه چهار
- Beetroot
- Ginger
- Potato
- Radish
ليست هاي منظم HTML
اگر تمايل داريد آيتم هاي خود را به جاي قرار دادن در يك ليست داراي bullet، در يك ليست عددگذاري شده قرار دهيد، مي توانيد از ليست منظم HTML استفاده كنيد. اين ليست با استفاده از برچسب < ol> ايجاد مي شود. شماره گذاري از يك شروع شده و براي هر ليست منظم عنصر بعدي با اضافه شدن يك عدد و به همراه برچسب< li>اضافه مي شود.
مي توانيد از ويژگي type براي برچسب < ol> استفاده كنيم تا نوع شماره گذاريمورد نظر خود را مشخص كنيد. به طور پيش فرض شماره گذاري به وسيله ي عدد انجام مي شود. در زير گزينه هاي ممكن را مشاهده مي كنيد.
<
ol
type
=
"1"
>
- Default-Case Numerals.
<
ol
type
=
"I"
>
- Upper-Case Numerals.
<
ol
type
=
"i"
>
- Lower-Case Numerals.
<
ol
type
=
"a"
>
- Lower-Case Letters.
<
ol
type
=
"A"
> - Upper-Case Letters.
ol
>
ol
>
ol
>
ol
>
ol
>
در زير مثالي را مي بينيد كه در آن از < ol type="1"> استفاده كرده ايم.
نمونه پنج
HTML Ordered List
- Beetroot
- Ginger
- Potato
- Radish
در زير مثالي را مي بينيد كه در آن از < ol type="I"> استفاده مي كنيم.
نمونه شش
HTML Ordered List
- Beetroot
- Ginger
- Potato
- Radish
در زير مثالي را ميبينيد كه در آن از < ol type="i"> استفاده كرده ايم.
نمونه هفت
HTML Ordered List
- Beetroot
- Ginger
- Potato
- Radish
: مثال
در زير مثالي را مي بينيد كه در آن از < ol type="A"> استفاده كرده ايم.
نمونه هشت
HTML Ordered List
- Beetroot
- Ginger
- Potato
- Radish
در زير مثالي را مي بينيد كه در آن از< ol type="a"> استفاده كرده ايم.
نمونه نه
HTML Ordered List
- Beetroot
- Ginger
- Potato
- Radish
ويژگي start
شما مي توانيد از ويژگي start براي برچسب < ol> استفاده كنيد تا نقطه ي شروع شماره گذاري خود را مشخص كنيد. در زير گزينه هاي ممكن را مشاهده مي كنيد.
<
ol
type
=
"1"
start
=
"4"
>
- Numerals starts with 4.
<
ol
type
=
"I"
start
=
"4"
>
- Numerals starts with IV.
<
ol
type
=
"i"
start
=
"4"
>
- Numerals starts with iv.
<
ol
type
=
"a"
start
=
"4"
>
- Letters starts with d.
<
ol
type
=
"A"
start
=
"4"
> - Letters starts with D.
ol
>
ol
>
ol
>
ol
>
ol
>
در زير مثالي را مي بينيد كه در آن از < ol type="i" start="4"> استفاده مي كنيم.
نمونه ده
HTML Ordered List
- Beetroot
- Ginger
- Potato
- Radish
ليست هاي تعريف HTML
HTML و XHTML ليست هايي به نام ليست هاي تعريف را پشتيباني مي كنند كه در اين ليست ها ورودي ها مانند ترتيب لغات در ديكشنري قرار مي گيرند. اين ليست يك روش ايده آل براي ارائه يك فهرست از معاني يا ليستي از اصطلاحات يا ليستي از نام ها و مقادير مي باشد.
ليست تعريف از سه برچسب زير استفاده مي كند
- < dl> - شروع ليست را تعريف مي كند.
مثال:
نمونه يازده
HTML Definition List
- HTML
- This stands for Hyper Text Markup Language
- HTTP
- This stands for Hyper Text Transfer Protocol
جهت مشاهده كدها برروي آموزش طراحي سايت كليك نماييد