تخفیف ویژه زمستانه پی استور

تا 60 درصد تخفیف

شامل پروژه‌ها و دوره‌های آموزشی
روز
ساعت
دقیقه
ثانیه
آخرین فرصت‌ها

با خرید اشتراک ویژه ، با هزینه بسیار کمتر به فایل های پاورپوینت دسترسی داشته باشید!

تگ لینک

تگ لینک
در بحث آموزش html وقتی نوبت به تزیین فایل می‌رسه، آموزش تگ لینک، جزو حیاتی‌ترین کارهای هر زبان آموزیه. وقتی در یک فایل اچ تی ام ال اقدام به نوشتن تگ لینک می‌کنیم، درواقع ابلاغ می‌کنیم که این سند با یه فایل دیگه ارتباط داره و یک پیوند آسمانی! بین اون دو تا ایجاد می‌کنیم. معمولا از این تگ برای پیوند دادن به فایل‌های css استفاده می‌شه اما واسه تعریف آیکون سایت یا فاوآیکون (Favicon) هم از این تگ استفاده می‌کنیم.

فهرست مطالب

تگ لینک کجا تشریف دارن؟

این تگ باید داخل تگ head نوشته بشه. عین تگ‌های متا و title که در جلسات قبل درموردشون حرف زدیم. یعنی بخوام بهتر بگم تنها جای ممکن واسه تگ لینک، فقط و فقط تگ head هستش. یه وقت نیایین قبل یا بعد اون بنویسین. از من گفتن!

کاربردهای تگ لینک

۱- تعریف استایل خارجی

برای زیباسازی سایت و تک تک صفحاتمون نیاز به دستورات css داریم. استایل دهی در html به ۳ روش انجام می‌شه: استایل خطی، استایل داخلی و استایل خارجی. در آموزش html گفتیم که بهترین روش، استایل دهی خارجیه. برنامه نویسای کاربلد میان یک یا چند فایل css ایجاد می‌کنن که پسوندشون هم css. هستش. بعد دستورات css رو داخل اون فایل‌ها کد می‌زنن. اما حالا که فایل html و فایل css مون کاملا مستقل از همند، مرورگرها چجوری باید دستورات زیبای css رو به این فایل html مون ربط بدن؟ از کجا می‌فهمن بین اینا پیوند برقراره؟ جواب: تگ لینک

فرض می‌کنیم فایل اچ تی ام ال ما index.html هستش و فایل سی اس اس مون هم style.css. حالا واسه اینکه دستورات css فایل style.css در فایل index.html اجرا بشن:

تگ لینک و استایل دهی خارجی

خصوصیت rel در تگ لینک

نوشتن این خصوصیت و نیز مقدار آن الزامیه. این خصوصیت نوع رابطه یا نوع پیوند رو مشخص می‌کنه. در این مثال چون هدفمون استایل دهی بود باید مقدار rel رو برابر stylesheet قرار می‌دادیم. بازم عرض می‌کنم حتما باید خصوصیت rel و مقدارش رو در تگ‌های لینک تعریف کنین.

خصوصیت href در تگ لینک

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

۲- تعریف فاوآیکون با تگ لینک

از تگ لینک برای تعریف آیکون سایت هم استفاده می‌شه. با توجه به مستندات وبسایت مرجع  w3schools  این تگ موقع تعریف favicon باید اینجوری نوشته بشه:

تگ لینک و تعریف favicon

البته این یک مثاله. مقادیر href، type و sizes با توجه به فایلمون و نام و آدرسش تغییر می‌کنه. اما خصوصیت rel و مقدار icon برای تعریف فاوآیکون اجباریه.-

——

پشتیبانی مرورگرها

همه مرورگرهای فعلی جهان، از تگ پیوند پشتیبانی می‌کنند:

نام مرورگر پشتیبانی گوگل کروم از تگ لینک head پشتیبانی muzilaLOGO از تگ لینک حمایت safari از تگ لینک پشتیبانی Opera از تگ لینک پشتیبانی explorer از تگ لینک
پشتیبانی می کند؟ بله بله بله بله بله

خصوصیت‌ها و صفات تگ لینک

نام خصوصیت

مقادیر

توضیحات خصوصیت

charset char_encoding انکودینگ کاراکترهای فایلی که بهش پیوند یا لینک شده رو مشخص میکنه

در HTML5 پشتیبانی نمی شود X

crossorigin anonymous
use-credentials
اجازه نمایش تصاویر در قالب canvas  از طریق دسترسی متقابل سایت مبدأ

در HTML5 اضافه شد

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
نوع پیوند رو در تگ لینک مشخص میکنه

نوشتنش الزامیه

sizes عرض * ارتفاع فقط وقتی کار میکنه که rel برابر icon باشه

سایز منبع لینک شده رو در تگ لینک مشخص میکنه

در HTML5 اضافه شد

type media_type نوع صفحه و نوع رسانه لینک شده

برای دانلود فیلم آموزش html ، به صورت ساده اما پیشرفته می‌تونین به این آدرس مراجعه کنین.

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *