Веб-разработка / программирование

4 HTML-тега, которые вы могли не знать

Мы все время используем только одни и те же 5 HTML-тегов. Пока я не написал эту статью, я не осознавал, что их намного больше. И многие из них действительно полезны - вот несколько примеров.

Если в HTML-коде много URL-адресов, их легко потерять.
Базовый тег может помочь справиться с хаосом.

Вот пример: на наш сайт мы хотим встроить изображение с Pixabay. Полный URL-адрес изображения выглядит так:

Https://cdn.pixabay.com/photo/2016/11/22/18/52/cake-1850011_1280.jpg

Если мы хотим включить больше изображений, имеет смысл использовать базовый тег. Он определяет базовый URL для всей страницы. Затем мы можем опустить этот базовый URL из src-тегов изображений. Вот код:

<body>
  <base href=”https://cdn.pixabay.com/photo/" target=”_blank” />
  
  <img src=”2016/11/22/18/52/cake-1850011_1280.jpg” />
  <img src=”2015/07/12/14/26/coffee-842020_1280.jpg” />
</body>

Как видите, мы разделили весь URL-адрес изображений - на фиксированную и переменную части. Базовая метка помогает сократить линии и создать ясность.

‹Sub› & ‹sup›

Иногда может быть полезно установить текст выше или ниже. Например при работе с источниками или индексами. Вот что я имею в виду:

Это довольно просто. Для пониженного текста: <sub>Down</sub> u и для верхнего индекса: <sup>Up</sup>.

‹Optgroup›

Большинство людей знают, как создать раскрывающийся список с возможностью выбора.
Но знаете ли вы, что можно дополнительно разделить варианты?
Я видел это раньше, но никогда не думал, как это сделать.

Вот код:

Чтобы сделать текст жирным и курсивом, есть теги ‹b› и ‹i›.
Но есть еще одно, чтобы уменьшить текст.

Спасибо за чтение!