HTML з нуля: спецсимволи в HTML. Урок №4 Overcod.net

HTML з нуля: спецсимволи в HTML. Урок №4

Привіт, друзі!
Сьогодні я розповім про спецсимволи в HTML — важливу частину будь-якого веб-документа. Ви дізнаєтесь:

для чого вони потрібні,
як їх правильно використовувати,
і, звісно, знайдете корисну таблицю спецсимволів наприкінці статті.

Готові? Тоді почнемо!

Для чого потрібні спецсимволи в HTML

Спецсимволи — це унікальні символи, яких немає на клавіатурі або які браузери інтерпретують неправильно, якщо їх використовувати безпосередньо. Наприклад:

Як написати символ ©? Просто ввести його в код не вийде.
Як зробити кілька пробілів поспіль? HTML проігнорує їх, залишивши лише один.
Як показати код із HTML-тегами? Якщо просто вставити < і >, браузер вирішить, що це команда, а не текст.

Саме тут нам стають у пригоді спецсимволи. Розберімося на прикладах.

Приклад: Як показати HTML-теги

Якщо ви спробуєте вставити наступний код:

<html>  
  <head>  
    <title>Приклад</title>  
  </head>  
  <body>  
  </body>  
</html>

то браузер сприйме його як частину сторінки, а не текст. Щоб це виправити, потрібно замінити < і > на спецсимволи < і >. Ось як це виглядатиме:

&lt;html&gt;  
  &lt;head&gt;  
    &lt;title&gt;Приклад&lt;/title&gt;  
  &lt;/head&gt;  
  &lt;body&gt;  
  &lt;/body&gt;  
&lt;/html&gt;

Результат:

<html>
<head>
<title>Приклад</title>
</head>
<body>
</body>
</html>

Зручно, правда?

Як додати пробіли

Звичайні пробіли в HTML можуть бути хитрими. Якщо ви хочете зробити кілька пробілів, використовуйте  . Наприклад:

слово1&nbsp;&nbsp;&nbsp;слово2

Результат:

слово1 слово2

Як виводити спецсимволи в HTML

Щоб вставити спецсимвол, використовуйте його код. Наприклад, знак копірайту (©):

Усі права захищені &copy; 2024.

Таблиця популярних спецсимволів HTML

Символ	Код	Опис	Приклад відображення
&	&	Амперсанд	&
<	<	Менше	<
>	>	Більше	>
“	"	Подвійні лапки	“
‘	'	Апостроф	‘
©	©	Знак авторського права	©
®	®	Знак зареєстрованої торгової марки	®
™	™	Знак торгової марки	™
€	€	Євро	€
£	£	Фунт	£
¥	¥	Єна	¥
°	°	Градус	°
±	±	Плюс-мінус	±
×	×	Множення	×
÷	÷	Ділення	÷
—	—	Довге тире	—
–	–	Коротке тире	–
		Нерозривний пробіл	(немає відображення)