برچسب: html link

  • ایجاد لیست های مرتب و نامرتب در اچ تی ام ال

    در اچ تی ام ال دو نوع لیست داریم ، لیست های مرتب و نامرتب ، برای ایجاد لیست های مرتبط از تگ <ol> و برای ایجاد لیست های نامرتب از تگ <ul> استفاده میکنیم.

    چگونه لیستی مرتب از اعداد ایجاد کنم ؟

    برای اینکه لیستی مرتب از اعداد ایجاد کنیم از صفت type در <ol> استفاده مکنیم.

    به این صورت

    <ol type="1">
    <li>Item1</li>
    <li>Item2>/li>
    <li>Item3</i>
    </ol>

    خروجی

    1. item1
    2. item2
    3. item3

    میخواهم لیست من از عدد مشخصی شروع بشه ، برای اینکار از صفت start استفاده میکنیم.

    <ol type="1" start="7">
    <li>item1</li>
    <li>item2</li>
    <li>item3</li>
    </ol>

    خروجی

    1. item1
    2. item2
    3. item3

    چگونه می توانم لیستی مرتب با حروف انگلیسی ایجاد کنم؟

    برای این کار هم از صفت type به صورت زیر استفاده میکنیم.

    <ol type="A">
    <li>item1</li>
    <li>item2</li>
    <li>item3</li>
    </ol>

    خروجی

    1. item1
    2. item2
    3. item3

    چگونه میتوانم لیستی مرتب با اعداد رومی ایجاد کنم؟

    برای این کار کافیست مقدار صفت را به این صورت تغریف کنیم.type=”I”

    <ol type="I">
    <li>item1</li>
    <li>item2</li>
    <li>item3</li>
    </ol>

    خروجی

    1. item1
    2. item2
    3. item3

    چطور لیستی نامرتب ایجاد کنم؟

    <ul>
    <li>item1</li>
    <li>item2</li>
    <li>item3</li>
    </ul>

    خروجی

    • item1
    • item2
    • item3

    چطور لیستی ایجاد کنم که دایره نشون داده بشه ؟

    برای اینکار از تگ type با مقدار circle استفاده میکنیم.

    <ul type="circle">
    <li>item1</li>
    <li>item2</li>
    <li>item3</li>
    </ul>

    خروجی

    • item1
    • item2
    • item3

    چطور لیستی ایجاد کنم که دایره توپر نشون داده بشه ؟

    برای اینکار از تگ type با مقدار disc استفاده میکنیم.

    <ul type="disc">
    <li>item1</li>
    <li>item2</li>
    <li>item3</li>
    </ul>

    خروجی

    • item1
    • item2
    • item3

    چطور لیستی ایجاد کنم که مربع نشون داده بشه ؟

    برای اینکار از تگ type با مقدار squareاستفاده میکنیم.

    <ul type="square">
    <li>item1</li>
    <li>item2</li>
    <li>item3</li>
    </ul>

    خروجی

    • item1
    • item2
    • item3

    خب حالا یه مثال کاربردی و مهم از لیست ها

    چطور با استفاده از لیست یک منو ایجاد کنیم؟

    آموزش ایجاد لینک در html

    خب یه لیست ایجاد میکنیم که ایتم های آن لینک هستن !!!

    <ul>
    <li><a href="link" title="">home</a></li>
    <li><a href-"" title="">blog</a></li>
    <li><a href="" title="">email</a></li>
    <li><a href="" title="">contact</a></li>
    </ul>

    خروجی

  • لینک در اچ تی ام ال

    برای ایجاد لینک ها در اچ تی ام ال از تگ <a>  استفاده میکنیم. (A = Anchor)

    تگ لینک <a>  دارای خصیصه های (attribute)  زیر هست :

    Href برای افزودن آدرس لینک

    Title برای افزودن توضیح در مورد لینک  

    Target مشخص کردن نحوه ی باز شدن صفحه لینک  

     

    ساختار کلی تگ a  برای ایجاد لینک

    <a href="link address"  title=" link description"  target=" _target"> Link </a>

    الف ) نحوه ی آدرس دهی

    داخلی href = mypage.html

    خارجی href = http://1coder.blog.ir

     

    ب ) نحوه ی نمایش لینک (باز شدن صفحه لینک)

     Target = _self تو همون صفحه که هستیم (صفحه جاری)

    Target = _blank  تو صفحه دیگه (صفحه جدید)

    مثال :

    الف ) ایجاد لینک با آدرس داخلی که در صفحه جاری باز بشه

    <a href=”about.html”  title=”درباره ی من”  target=”_self”>پروفایل</a>
    

    پیش فرض نحوه ی باز شدن لینک ؛ باز شدن درصفحه جاری هست.

    ب ) ایجاد لینک با آدرس خارجی که در صفحه جداگانه باز میشه

    <a href="http://www.1coder.blog.ir"  title="درباره ی من "  target="_blank">پروفایل</a>