Html href: Атрибут href | htmlbook.ru

HTML href – сокращенно гипертекстовая ссылка. Это атрибут, который доступен внутри тега привязки (). Этот href используется для URL-адресов веб-сайтов, таких как www.google.com, www.gmail.com, www.facebook.com и т. д.

Пример в реальном времени. Изо дня в день мы заходим на множество веб-сайтов. Вы когда-нибудь задумывались о том, как мы получим доступ к URL-адресам этого веб-сайта? Благодаря тегу href мы можем получить доступ к любым URL-адресам веб-сайтов. Нам просто нужен веб-сайт в двойных кавычках (href=»website») атрибута href.

 


<голова>

  css">

<тело>
 
Тег  с введением атрибута href 
HTML href – сокращенно гипертекстовая ссылка. Это атрибут, который доступен внутри тега привязки (). Этот href используется для URL-адресов веб-сайтов, таких как www.google.com, www.gmail.com, www.facebook.com и т. д.

Пример в реальном времени. Изо дня в день мы заходим на множество веб-сайтов. Вы когда-нибудь задумывались о том, как мы получим доступ к URL-адресам этого веб-сайта? Благодаря тегу href мы можем получить доступ к любым URL-адресам веб-сайтов. Нам просто нужен веб-сайт в двойных кавычках (href="website") атрибута href.


 

Код CSS: styles.css

 p
{
красный цвет;
граница: 2 пикселя сплошного зеленого цвета;
размер шрифта: 22px;
}
h2
{
оранжевый цвет;
выравнивание текста: по центру;
} 

Вывод:

Заключение

hrefin HTML используется для доступа к веб-URL. Существуют теги, которые позволяют атрибут href, это ,, и. Наиболее часто используются теги и.

Рекомендуемая статья

Это руководство по тегу href в HTML. Здесь мы обсуждаем введение в тег href в HTML и его примеры, а также реализацию кода и вывод. вы также можете просмотреть наши рекомендуемые статьи, чтобы узнать больше —

1. 15 лучших свойств тега Span в HTML
2. Как тег div работает в HTML?
3. Строка поиска HTML | Примеры
4. Тег Canvas в HTML | Примеры

Атрибуты – Мопс

Атрибуты тега похожи на HTML (с необязательными запятыми), но их значения — это обычный JavaScript.

(ПРИМЕЧАНИЕ. В примерах на этой странице для управления пробелами используется символ вертикальной черты ( | ).)

а(href=’//google.com’) Google | | a(class=’button’ href=’//google.com’) Google | | a(class=’button’, href=’//google.com’) Google

Google Google Google

Обычные выражения JavaScript тоже работают нормально:

— переменная аутентификация = истина body(class=authenticated ? ‘authed’ : ‘anon’)

<тело>

Многострочные атрибуты

Если у вас много атрибутов, вы также можете распределить их по многим строкам:

вход( тип = ‘флажок’ имя=’соглашение’ проверил )

Если ваша среда выполнения JavaScript поддерживает строки шаблонов ES2015 (включая Node. js/io.js 1.0.0 и более поздние версии), вы можете использовать этот синтаксис для атрибутов. Это действительно полезно для атрибутов с очень длинными значениями:

ввод (данные-json = ` { «очень-длинный»: «кусок», «данные»: правда } `)

<входные данные-json=" { "очень-длинный": "кусок", "данные": правда } "/>

Атрибуты в кавычках

Если имя вашего атрибута содержит нечетные символы, которые могут мешать синтаксису JavaScript, либо заключайте его в кавычки, используя

div(class=’div-class’, (щелчок)=’play()’) div(class=’div-class’ ‘(click)’=’play()’)

Интерполяция атрибутов

Предостережение

Предыдущие версии Pug/Jade поддерживали синтаксис интерполяции, такой как:

 a(href="/#{url}") Ссылка
 

Этот синтаксис больше не поддерживается. Альтернативы указаны ниже. (Дополнительную информацию о других несовместимостях между Pug v2 и предыдущими версиями см. в нашем руководстве по миграции.)

Вот несколько альтернатив, которые вы можете использовать для включения переменных в свой атрибут:

1. Просто напишите атрибут в JavaScript:

   — var url = ‘pug-test.html’; a(href=’/’ + url) Ссылка | | — URL = ‘https://example.com/’ a(href=url) Другая ссылка

   Ссылка Другая ссылка

2. Если ваша среда выполнения JavaScript поддерживает строки шаблонов ES2015 (включая Node.js/io.js 1.0.0 и более поздние версии), вы также можете использовать его синтаксис для упрощения своих атрибутов:

   — вар btnType = ‘информация’ — вар btnSize = ‘lg’ кнопка (тип = ‘кнопка’ + btnType + ‘btn-‘ + btnSize) | | button(type=’button’ class=`btn btn-${btnType} btn-${btnSize}`)

   <тип кнопки="кнопка">

Неэкранированные атрибуты

По умолчанию все атрибуты экранированы, т. е. специальные символы заменены escape-последовательностями, чтобы предотвратить атаки (например, межсайтовые сценарии). Если вам нужно использовать специальные символы, используйте

раздел(экранированный=»<код>«) div(unescaped!=»")

Внимание!

Неэкранированный буферизованный код может быть опасен. Вы должны обязательно дезинфицировать любые пользовательские данные, чтобы избежать межсайтовых сценариев.

Логические атрибуты

Логические атрибуты зеркально отражены Pug. Логические значения ( true и false ) принимаются. Если значение не указано, предполагается, что является истинным .

Атрибут стиля может быть строкой, как и любой обычный атрибут; но это также может быть и объект, что удобно, когда стили генерируются с помощью JavaScript.

a(style={color: ‘красный’, background: ‘зеленый’})

Атрибуты класса

— классы переменных = [‘foo’, ‘bar’, ‘baz’] а (класс = классы) | | //- атрибут класса также может повторяться для объединения массивов a.bang(класс=классы класс=[‘bing’])

<а>

Это также может быть объект, который сопоставляет имена классов со значениями true или false . Это полезно для применения условных классов

— var currentUrl = ‘/о’ a(class={active: currentUrl === ‘/’} href=’/’) Главная | | a(class={active: currentUrl === ‘/about’} href=’/about’) Около

Главная О нас

Литерал класса

Классы могут быть определены с использованием синтаксиса .classname :

Кнопка

Так как div являются таким распространенным выбором тега, это значение по умолчанию, если вы опускаете имя тега:

.content

Идентификационный литерал

ID могут быть определены с помощью #idname 9Синтаксис 0153:

a#main-link

Так как div являются таким распространенным выбором тега, это значение по умолчанию, если вы опускаете имя тега:

#content

&атрибуты

Синтаксис &attributes , произносимый как «и атрибуты», может использоваться для разделения объекта на атрибуты элемента.