تعریف و کاربرد تگ link در HTML
تگ <link> تگی است که با استفاده از آن می توان یک لینک بین یک سند ( صفحه وب ) و یک منبع ( سورس ) خارجی (چیزی که خارج از صفحه جاری باشد) ایجاد کرد.
با استفاده از این تگ به راحتی می توان فایل های CSS خارجی را به صفحه وب متصل نمود.
توجه داشته باشید که تگ <link> را باید در بین تگ<head> قرار داد، و تگ <head> هم همیشه باید بعد از تگ <html> و قبل از تگ <body> در یک صفحه وب نوشته شود.
-
- تگ <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 | نوع رسانه ، صفحه ای که بهش لینک کرده ایم را مشخص می کند. |