آموزش HTML – تگ link

نویسنده : مرتضی گنج | تاریخ انتشار : 2020/01/13 | بخش : آموزش HTML

تعریف و کاربرد تگ link در HTML

تگ <link> تگی است که با استفاده از آن می توان یک لینک بین یک سند ( صفحه وب ) و یک منبع ( سورس ) خارجی (چیزی که خارج از صفحه جاری باشد) ایجاد کرد.

با استفاده از این تگ به راحتی می توان فایل های CSS خارجی را به صفحه وب متصل نمود.

    • تگ <link> ارتباط بین یک سند و یک منبع خارجی را تعریف می کند.
    • تگ <link> برای پیوند به style sheets (شیوه نامه های خارجی) استفاده می شود.
    • تگ <link> یک عنصر خالی است، و فقط شامل attributes (خصوصیت ها) می باشد.
    • تگ <link> تنها در قسمت head قرار می گیرد، اما می توان بارها از آن استفاده کرد.

 

تفاوت بین HTML 4.01 و HTML5

  • بعضی از خصوصیت های موجود در HTML 4.01 در HTML5 پشتیبانی نمی شوند.
  • خصوصیت “sizes” یک خصوصیت جدید در HTML5 است.

 

تفاوت های بین HTML و XHTML

  • در HTML تگ <link> تگ پایانی ندارد.
  • در XHTML تگ <link> باید با یک تگ پایانی بسته شود.

 

مثال از تگ link در HTML

<head>
  <link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

 

 

پشتیبانی مرورگرها از تگ link در HTML

Element
<link> بله بله بله بله بله

جدول صفات تگ link در HTML

نام صفت  مقدار توضیح
charset char_encoding مجموعه کاراکترهای سندی که بهش لینک شده را مشخص می کند.
crossorigin anonymous
use-credentials
اجازه نمایش تصاویر در ظرف کَنویس ( canvas ) از طریق دسترسی متقابل سایت مبدأ.
href URL آدرس صفحه ی مقصد که قرار است کاربر به آنجا منتقل شود.
hreflang language_code زبان صفحه ی مقصد (که بهش لینک شده) را مشخص می کند.
media media_query مشخص می کند که لینک برای چه نوع رسانه یا دستگاهایی بهینه شود.
rel alternate
author
dns-prefetch
help
icon
license
next
pingback
preconnect
prefetch
preload
prerender
prev
search
stylesheet
ابطه ی بین صفحه ی جاری با صفحه ای که به آن لینک کرده ایم را مشخص می کند.
rev alternate
author
dns-prefetch
help
icon
license
next
pingback
preconnect
prefetch
preload
prerender
prev
search
stylesheet
دقیقا برعکس rel – رابطه بین صفحه لینک شده و صفحه جاری را مشخص می کند.
sizes Height_Width
any
اندازه اون منبعی که بهش لینک کرده ایم را مشخص می کند. (فقط برای نوع icon)
target _blank
_self
_top
_parent
frame_name
مشخص می کند که صفحه ی مقصد چگونه نمایش داده شود. (مثلا در یک تب جدید از مرورگر یا ..)
type media_type نوع رسانه ، صفحه ای که بهش لینک کرده ایم را مشخص می کند.