Размеры шрифта на CSS: абсолютные и относительные единицы измерения.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Font sizes</title>
<style>
* {
margin: 0;
}
body {
font-size: 20px;
line-height: 1.5;
margin: 20px;
}
code {
color: #c00;
}
h2, #htmldog {
margin-top: 20px;
}
#len1 {
font-size: 12px;
}
#len2 {
font-size: 12pt;
}
#len3 {
font-size: 12q;
}
#len4 {
font-size: 1.2ex;
}
#len5 {
font-size: 1.2em;
}
#len6 {
font-size: 1.2vmax; /* not supported by Internet Explorer */
}
#pc1 {
font-size: 50%;
}
#pc2 {
font-size: 100%;
}
#pc3 {
font-size: 150%;
}
#kw1 {
font-size: x-small;
}
#kw2 {
font-size: medium;
}
#kw3 {
font-size: x-large;
}
</style>
</head>
<body>
<h1>Размеры шрифта</h1>
<p>Размеры шрифта можно задать с помощью свойства <a href="https://foxyforex.ru/css/svojstvo-css-font-size"><code>font-size</code></a> значением которого может быть длина, процент или ключевое слово.
</p>
<h2><a href="https://foxyforex.ru/css/znachenie-css-dlina">Длины</a></h2>
<h3>Абсолютные длины</h3>
<ul>
<li><code id="len1">font-size: 12px</code></li>
<li><code id="len2">font-size: 12pt</code></li>
<li><code id="len3">font-size: 12q</code></li>
</ul>
<h3>Относительные длины</h3>
<ul>
<li><code id="len4">font-size: 1.2ex</code></li>
<li><code id="len5">font-size: 1.2em</code></li>
<li><code id="len6">font-size: 1.2vmax</code></li>
</ul>
<h2><a href="https://foxyforex.ru/css/znachenie-css-v-procentax">Проценты</a></h2>
<ul>
<li><code id="pc1">font-size: 50%</code></li>
<li><code id="pc2">font-size: 100%</code></li>
<li><code id="pc3">font-size: 150%</code></li>
</ul>
<h2>Ключевые
слова </h2>
<ul>
<li><code id="kw1">font-size: x-small</code></li>
<li><code id="kw2">font-size: medium</code></li>
<li><code id="kw3">font-size: x-large</code></li>
</ul>
</body>
</html>Страницы в тему:
- Размер не имеет значения
- Текст (Урок CSS для начинающих)
