درحال بارگذاری

آموزش HTML قسمت دهم – "HTML Links & HTML Lists"

تاریخ: یکشنبه, 15 تیر 99

نویسنده: علیرضا غفاری... بازیدها: 125 - نظرات : 0 دسته بندی: برنامه نویسی تحت وب


در قسمت قبلی عناصر نقل قول و استناد در html را توضیح دادیم و در این مطلب قصد دارم تا شما را با لیست ها و لینک ها در html و نحوه ی استفاده و کاربرد آن آشنا کنم پس در ادامه با ما همراه باشید.

قسمت قبلی آموزش html

HTML Links & HTML Lists

تقریباً در تمام صفحات وب لینک یافت می شوند. لینک ها به کاربران این امکان را می دهند که از صفحه به صفحه دیگر راه خود را کلیک کنند.

توجه: یک لینک لازم نیست متن باشد. یک لینک می تواند یک تصویر یا هر عنصر HTML دیگر باشد!

برای ایجاد یک لینک در HTML ما باید از تگ <a> استفاده نماییم، شکل کلی برای ایجاد یک لینک در HTML بصورت زیر می باشد :

<a href="https://oneclass.ir//">Visit oneclass.ir/!</a>

 

 

در دستور بالا کافیست در صفت href بجای url آدرس مقصد را نوشته و بجای متن Text In Here نیز یک متن دلخواه برای اینکه به کاربر نمایش داده شود و کاربر بتواند بروی آن کلیک نماید.

بطور پیش فرض ، پیوندها به صورت زیر در همه مرورگرها ظاهر می شوند:

  • یک پیوند ناشناخته تأکید شده و آبی است
  • یک پیوند بازدید شده دارای برجسته و بنفش است
  • یک لینک فعال تأکید شده و قرمز است

البته پیوندها را می توان با CSS طراحی کرد تا جلوه دیگری به دست آورد!

HTML Links - Use an Image as a Link

برای ایجاد یک تصویر لینک دار یا تصویری که بتوان با کلیک بروی آن به مکانی دیگر منتقل شویم باید از تگ <img> درون تگ <a> استفاده نماییم.

<a href="default.asp">
<img src="smiley.gif" alt="HTML tutorial" style="width:42px;height:42px;">
</a>

 

 

Link to an Email Address

از malto در اتربیوت href استفاده کنید برای ایجاد پیوندی که برنامه ایمیل را برای  کاربر باز می کند (برای ارسال نامه ای به ایمیل جدید).

<a href="mailto:someone@example.com">Send email</a>

 

 

Button as a Link

برای استفاده از دکمه HTMLها در به عنوان پیوند ، باید کد JavaScript استفاده کنید.جاوا اسکریپت به شما امکان می دهد آنچه را که در رویدادهای خاص مانند کلیک یک دکمه اتفاق می افتد ،مشخص کنید.

<button onclick="document.location='default.asp'">HTML Tutorial</button>

 

 

HTML Lists

در این قسمت از آموزش HTML میخواهیم با لیست ها در این زبان آشنا شویم، لیست یا List در HTML به سه دسته تقسیم می شوند،

  • لیست نامرتب یا Unordered list
  • لیست مرتب یا Ordered List
  • لیست دارای توضیحات یا Description List

Unordered HTML List

یک لیست نامرتب با تگ <ul> شروع می شود. هر مورد لیست با تگ <li> شروع می شود.موارد لیست به طور پیش فرض با گلوله (دایره های سیاه سیاه) مشخص می شوند.

<ul>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

 

 

Ordered HTML List

لیست مرتب شده با تگ <ol> شروع می شود. هر مورد لیست با تگ <li> شروع می شود.موارد لیست به طور پیش فرض با شماره مشخص می شوند.

<ol>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>

 

 

HTML Description Lists

HTML همچنین از لیست هایی که دارای توضیحات می باشند نیز پشتیبانی میکند، برای ایجاد یک لیست با توضیحات در HTML باید از تگ <dl> و برای ایجاد آیتم ها از تگ <dt> و برای ایجاد توضیحات از تگ <dd> استفاده کرد.

<dl>
  <dt>Coffee</dt>
  <dd>- black hot drink</dd>
  <dt>Milk</dt>
  <dd>- white cold drink</dd>
</dl>

 

 

 

ممنون از اینکه با ما همراه بودید ،اگر سوال یا پیشنهاد خاصی دارید می توانید از قسمت نظرات آنها را با ما در میان بگذارید.


نویسنده: علیرضا غفاری... بازیدها: 125 - نظرات : 0 دسته بندی: برنامه نویسی تحت وب

جستجو
کلاس برتر
ارائه دهنده بهترین و به روز ترین ویدیو های و مقالات آموزشی و همچنین مقالات مختلف در رابطه با تکنولوژی ،معماری ،مدیریت و سایر رشته های کاربردی.ما برای شما بهترین ها را میخواهیم.

سایر خدمات مجموعهخدمات زیر تحت مدیریت برد تخصصی ارائه می شود.
طراحی وب سایت
راه اندازی و پشتیبانی شبکه
هوشمند سازی منازل
افزایش کارایی نیرو انسانی
تعمیرات دستگاه های الکترونیکی
طراحی داخلی
تبلیغات فضای مجازی
برنامه نویسی