HTML-тег <code>
Тег <code> используется для вставки переменных, фрагментов программного кода и т. д. в HTML-документ. В браузере код отображается моноширинным шрифтом (шрифтом, в котором все символы имеют одинаковую ширину). По умолчанию тег <code> является строчным элементом.
Сам по себе тег <code> представляет одну строку кода или фразу. Для отображения нескольких строк кода его следует обернуть в <pre> элемент.
Для достижения лучших результатов вы можете использовать CSS.
Синтаксис
Тег <code> является парным. Содержимое записывается между открывающим (<code>) и закрывающим (</code>) тегами.
Пример использования HTML-тега <code>:
HTML-тег <code>
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<p>Ordinary text.</p>
<code>Line of program code.</code>
<p>Continuation of the ordinary text.</p>
</body>
</html>Результат
Пример использования HTML-тега <code> внутри HTML-тега <pre>:
Пример использования HTML-тега <code> внутри HTML-тега <pre>:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<pre>
<code>
body {
color: yellow;
font-size: 16px;
line-height: 1.5;
}
</code>
</pre>
</body>
</html>Пример использования HTML-тега <code> с CSS-свойствами:
Пример использования HTML-тега <code> с CSS-свойствами:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<style>
.code-style {
font-size: 20px;
line-height: 28px;
background-color: lightblue;
color: #ffffff;
}
</style>
</head>
<body>
<p>Ordinary text.</p>
<code class="code-style">Line of program code.</code>
<p>Continuation of the ordinary text.</p>
</body>
</html>Атрибуты
Тег <code> поддерживает Глобальные атрибуты и Атрибуты событий.
Например, вы можете использовать атрибут title для добавления всплывающей подсказки: <code title="Variable declaration">let x = 10;</code>.
Практика
Как правильно использовать HTML-тег <code>?