چرا سکان آکادمی؟
لیست ها در HTML

لیست ها در HTML

لیست ترتیبی (Ordered List)

لیست ترتیبی با تگ <ol> نمایش داده می‌شود و هر آیتم لیست با تگ <li> تعریف می‌شود.

به قطعه کد زیر و نتیجه ی آن دقت کنید:

<html>
    <head>
        <title>first page</title>
    </head>
    <body>
        <ol>
            <li>Red</li>
            <li>Blue</li>
            <li>Green</li>
        </ol>
    </body>
</html>

⚠️ موارد لیست ترتیبی به طور خودکار با اعداد علامت گذاری می شوند.

به طور پیش‌فرض، لیست ترتیبی از 1 شروع به شمارش می‌کند؛ اما می توان با استفاده از  ویژگی start شمارش را از یک عدد دلخواه شروع کرد:

<html>
    <head>
        <title>first page</title>
    </head>
    <body>
        <ol start="30">
            <li>Red</li>
            <li>Blue</li>
            <li>Green</li>
        </ol>
    </body>
</html>

به طور پیش فرض، لیست ترتیبی عددی می باشد اما می‌توان با استفاده از ویژگی type، لیست را به صورت الفبایی هم مرتب کرد. به مثال زیر توجه کنید:

<html>
    <head>
        <title>first page</title>
    </head>
    <body>
        <ol type="a">
            <li>Red</li>
            <li>Blue</li>
            <li>Green</li>
        </ol>
    </body>
</html>

⚠️  ویژگی type، می‌تواند مقادیر a، A، i، I و 1 را بپذیرد.

لیست های غیرترتیبی (Unordered List)

لیست غیرترتیبی با تگ <ul> مشخص می‌شود و هر آیتم لیست با تگ <li> تعریف می شود.

<html>
    <head>
        <title>first page</title>
    </head>        
    <body>
        <ul>
            <li>Red</li>
            <li>Blue</li>
            <li>Green</li>
        </ul>
    </body>
</html>

⚠️ موارد لیست غیرترتیبی به طور خودکار با بولت (دایره کوچک مشکی) علامت گذاری می‌شوند.

لیست توضیحی (Description Lists)

لیست توضیحی، فهرستی از مواردی می باشد که برای هر کدام توضیحی ارائه می‌دهد.

تگ <dl> لیست توضیحات را مشخص می‌کند، تگ <dt> آیتم را تعریف می‌کند، و تگ <dd> هر عبارت را توصیف می‌کند: 

<html>
    <head>
        <title>first page</title>
    </head>        
    <body>
        <dl>
            <dt>Coffee</dt>
            <dd>- black hot drink</dd>
            <dt>Milk</dt>
			<dd>- white cold drink</dd>
        </dl>
    </body>
</html>

 

2-1
عناوین (Headings) در HTML
تیم تولید محتوای سکان آکادمی
تیم تولید محتوای سکان آکادمی
1400/09/15
2-2
کامنت گذاری (Comment) و خطوط افقی (Horizontal Rule) در HTML
تیم تولید محتوای سکان آکادمی
تیم تولید محتوای سکان آکادمی
1400/09/15
2-3
پاراگراف ها در HTML
تیم تولید محتوای سکان آکادمی
تیم تولید محتوای سکان آکادمی
1400/09/15
2-4
تگ های فرمت دهی در HTML
تیم تولید محتوای سکان آکادمی
تیم تولید محتوای سکان آکادمی
1400/09/22
2-5
پروژه وبلاگ: درباره من
تیم تولید محتوای سکان آکادمی
تیم تولید محتوای سکان آکادمی
1400/10/02
2-6
عناصر HTML
تیم تولید محتوای سکان آکادمی
تیم تولید محتوای سکان آکادمی
1400/10/02
2-7
ویژگی‌ها (Attributes) در HTML
تیم تولید محتوای سکان آکادمی
تیم تولید محتوای سکان آکادمی
1400/10/06
2-8
تصاویر در HTML
تیم تولید محتوای سکان آکادمی
تیم تولید محتوای سکان آکادمی
1400/10/09
2-9
آزمون (لطفا وارد وبسایت شوید)
تیم تولید محتوای سکان آکادمی
تیم تولید محتوای سکان آکادمی
1400/10/13
2-10
لیست ها در HTML
تیم تولید محتوای سکان آکادمی
تیم تولید محتوای سکان آکادمی
1400/10/20
2-11
پروژه وبلاگ : مهارت‌های من
تیم تولید محتوای سکان آکادمی
تیم تولید محتوای سکان آکادمی
1400/10/27
2-12
جدول‌ها در HTML
تیم تولید محتوای سکان آکادمی
تیم تولید محتوای سکان آکادمی
1400/10/27
2-13
لینک‌ها در HTML
تیم تولید محتوای سکان آکادمی
تیم تولید محتوای سکان آکادمی
1400/10/30
2-14
پروژه وبلاگ : برنامه‌ی من
تیم تولید محتوای سکان آکادمی
تیم تولید محتوای سکان آکادمی
1400/11/05
2-15
عناصر Inline و Block در HTML
تیم تولید محتوای سکان آکادمی
تیم تولید محتوای سکان آکادمی
1400/11/05
دوره در حال تکمیل است ... rocket