تگ address در HTML

به نام خداوند علم و دانش. سلام به دوستان گرامی و مخاطبین وب سایت آموزشی کدیونی، وقت همگی بخیر، در این صفحه با مطلب تگ address در HTML از سری آموزش های HTML در خدمت شما عزیزان هستیم.

فهرست مطالب

امروزه فضای مجازی تاثیر زیادی بر زندگی روزمره مردم در اکثر نقاط جهان گذاشته تا بسیاری از کسب و کارها به صورت اینترنتی شوند و بسیاری از افراد یا شرکت ها، روی به راه اندازی وبسایت بیاورند. بسیاری از مشتریان جهت سوال و یا مشاوره نیاز به اطلاعاتی جهت تماس با آن ها دارند و در صورتی که قصد نمایش اطلاعات تماس از جمله آدرس ایمیل، آدرس سایت، شماره تلفن، نام نویسنده مقاله، نشانی محل کار و ... را در وبسایت خود دارید می توانید از تگ address در HTML استفاده کنید.

تگ address چیست؟

تگ آدرس اطلاعات تماس مربوط به سایت یا مقاله را نمایش می دهد.

استفاده از این تگ باعث درک بهتر موتورهای جستجو از محتوای سایت می شود.

این تگ با <address> شروع شده و با </address> پایان می یابد.

کد:

<address></address>

از این تگ در دو مورد می توان استفاده کرد:

  • نمایش اطلاعات تماس سایت
  • نمایش اطلاعات تماس مقاله

نمایش اطلاعات تماس سایت

در صورتی که قصد دارید اطلاعات تماس اصلی سایت را نمایش دهید بایستی این تگ را درون تگ body قرار دهید.

طبق مثال زیر می توان تگ آدرس را درون تگ footer هم قرار داد.

کد:

<body>
  <footer>
    <address>
      Email: <a href="mailto:example@example.com">example@example.com</a> <br>
      Tel: <a href="tel:+0123456789">0123456789</a>
    </address>
  </footer>
</body>

اجرا

نمایش اطلاعات تماس مقاله

در صورتی که قصد دارید اطلاعات تماس مقاله ای را نمایش دهید باید آن را درون تگ article قرار دهید.

کد:

<article>
  <address>
    Author: Name <br>
    Email: <a href="mailto:example@example.com">example@example.com</a> <br>
    Tel: <a href="tel:+0123456789">0123456789</a>
  </address>
</article>

اجرا

در مثال بالا تگ <br> جهت شکسته شدن خط فعلی و رفتن به خط بعدی استفاده می شود.

همان طور که مشاهده می فرمایید آدرس ایمیل و شماره تلفن را درون تگ a قرار دادیم.

با استفاده از mailto و tel در صفت href لینک، در صورتی که کاربر بر روی لینک کلیک کند جهت سهولت مستقیما برنامه ایمیل و تلفن کاربر باز خواهد شد.

مثلا اگر کاربر با موبایل وارد سایت شود و بر روی شماره تلفن کلیک کند شماره مستقیم وارد برنامه تماس خواهد شد و دیگر نیاز به حفظ یا تایپ شماره نخواهد بود.

تنظیمات پیش فرض CSS

تنظیمات پیش فرض CSS تگ address در اکثر مرورگرها به صورت زیر است:

address {
  display: block;
  font-style: italic;
}

در اکثر مرورگرها استایل فونت آن به صورت italic است و می توان با استفاده از CSS استایل این تگ را شخصی سازی کرد.

سازگاری با مرورگرها

تگ address با مرورگرهای زیر سازگار است:

  • گوگل کروم
  • فایرفاکس
  • اج
  • اپرا
  • سافاری
  • گوگل کروم اندروید
  • فایرفاکس اندروید
  • اپرا اندروید
  • سافاری iOS

معرفی مطالب در این زمینه