Атрибут HTML a href, пояснений прикладами

Атрибут відноситься до пункту призначення , наданої посиланням. a(Якір) тег мертвий без атрибута.

Як використовувати тег

Іноді у вашому робочому процесі ви не хочете посилання в реальному часі, або ви ще не знаєте місця призначення посилання. У цьому випадку корисно встановити hrefатрибут, "#"щоб створити мертве посилання.

hrefАтрибут може використовуватися для посилання на локальні файли або файли в Інтернеті.

Наприклад:

  Href Attribute Example   

Href Attribute Example

The freeCodeCamp Contribution Page shows you how and where you can contribute to freeCodeCamp's community and growth.

Атрибут підтримується всіма браузерами.

Більше атрибутів HTML:

hreflang : Вказує мову пов'язаного ресурсу.

target : Вказує контекст, у якому буде відкрито пов'язаний ресурс.

title : Визначає заголовок посилання, яке відображається користувачеві як підказка.

Приклади

This is a dead link This is a live link to freeCodeCamp more with a href attribute

Вбудовані прив'язки

Також можна встановити прив'язку до певного місця сторінки. Для цього вам слід спочатку розмістити вкладку в місці на сторінці з тегом та необхідним атрибутом “name” з будь-яким описом ключового слова в ньому, наприклад:

Будь-який опис між тегами не потрібно. Після цього ви можете розмістити посилання, що веде до цього якоря, у будь-якому місці на тій же сторінці. Для цього слід використовувати тег з необхідним атрибутом “href” із символом # (різкий) та ключовим словом описом якоря, наприклад:

Go to Top

Посилання на зображення

Також може застосовуватися до зображень та інших елементів HTML.

Приклад

Ще кілька прикладів href

This gives a base url for all further urls on the page This is a live link to an external stylesheet

Що ще можна зробити?

Більше налаштувань! Давайте подивимось конкретний випадок використання:

Посилання на електронну пошту - це різновид гіперпосилання ( ) із особливими параметрами, що дозволяє вказати додаткових одержувачів, рядок теми та / або основний текст.

Основний синтаксис з одержувачем:

Some text

Додавання теми до цього повідомлення:

Якщо ви хочете додати певну тему до цієї пошти, будьте обережні, щоб додати, %20або +там, де в рядку теми є пробіл. Простий спосіб переконатись, що він правильно відформатований, - це використання декодера / кодера URL-адреси.

Додавання основного тексту:

Так само ви можете додати конкретне повідомлення в основну частину електронного листа: Знову ж, пробіли потрібно замінити на %20або +. Після параметри суб'єкта перед будь-яким додатковим параметром повинен стояти&

Приклад: Скажімо, ви хочете, щоб користувачі надсилали електронне повідомлення своїм друзям про їхній прогрес у Free Code Camp:

Адреса: порожня

Тема: Чудова новина

Body: Я стаю розробником

Ваше посилання на html зараз:

Send mail!

Тут ми залишили mailto порожнім (mailto :?). Це відкриє поштовий клієнт користувача, і користувач сам додасть адресу одержувача.

Додавання більше одержувачів:

Таким же чином ви можете додати параметри CC та bcc. Кожну адресу розділіть комою!

Додаткові параметри повинні передувати &.

Send mail!

Більше інформації:

MDN - Посилання на електронну пошту