5 Html елементів які ви не знаєте

Відео: Знайомство з CSS Flexbox

5 HTML елементів які ви не знаєте

Раніше я розглядав плюси HTML5. Нові елементи, такі як,,

і
зробили структуру документа семантичної і «значимої». Дані елементи допомагають пошуковим роботам краще розуміти структуру документа. Але HTML елементів дуже багато, і, можливо, деякі ви могли не помітити.

1. Елемент

Цей елемент використовується для виведення результату будь-якого скрипта. Елемент був введений ще в HTML3. Нижче ви можете побачити приклад використання даного тега:

1
lt;pgt; Результат виконання скрипта lt;sampgt; ТУТ РЕЗУЛЬТАТlt;/sampgt; ви побачите в тезі samp.lt;/pgt;

Тег підтримує навіть Internet Explorer 5. Він відображає текст в Моноширинний шрифті як теги

 і 

тег samp

2. Елемент

Тег використовується для того, щоб задати текст який набирається на клавіатуру або назви клавіш:

1
lt;pgt; Натисніть lt;kbdgt; ENTERlt;/kbdgt; для створення нового облікового запису.lt;/pgt;


За замовчуванням цей тег також має моно шрифт.

Теги допомагають краще зрозуміти структуру вашого документа. Але так як всі вони мають моно шрифт, то для користувача це не дуже зручно. З допомогою CSS ми можемо зробити більш привабливий вигляд даного тега:

12345678
kbd {border: 1px solid # 333-background: linear-gradient(#aaa 0%, # 555 100%)-color: #fff-padding: 3px 8px-border-radius: 3px-box-shadow: 0px 2px 0px 0px # 111-}
тег kbd

3. Елемент

Елемент використовується для того, щоб виділити змінну будь-якого коду. Цей текст за замовчуванням у браузері відображається курсивом:

1
lt;pgt; Мінлива lt;vargt; ylt;/vargt; дорівнює 30.lt;/pgt;

Звичайно, цього тегу також можна задати стилі, і він буде виглядати більш красиво. Але ось як він виглядає спочатку:

тег var

4. Елемент

При визначенні нового слова в тексті, йому дається визначення і він виділяється курсивом. Тобто при подальшому читанні читач уже знає значення даного слова. Так ось цей тег дозволяє виділяти курсивом новий термін:

1
lt;pgt; Слово lt;dfngt; інноваціяlt;/dfngt; походить від латинського inovatis (in - в, novus - новий) і в перекладі означає «оновлення, новинку, зміна».lt;/pgt;

І в браузері виглядає це так - звичайний курсив:

тег dfn

Відео: Секції в футере - HTML Шорти

5 елемент

тег це новий елемент, який був введений в HTML5:

1
lt;pgt; В цьому місціlt;/markgt; я хочу загострити вашу увагу!lt;/pgt;

Тег використовується для того, щоб залучити увагу користувача і загострити увагу на якомусь мiсцi тексту. Фон тексту стає яскраво-жовтим, а сам текст чорним. Ви можете побачити результат на скріншоті нижче:

тег mark

висновок

Я думаю дана стаття була корисна для вас і ви дізналися щось нове. Обов`язково застосуйте це на практиці, щоб закріпити отримані знання.

Успіхів!

З повагою, Юрій Німець

джерело: https://hongkiat.com/blog/html-tag-that-you-probably-dont-know/

Поділися в соц мережах:
Cхоже

Увага, тільки СЬОГОДНІ!