Заглавные (или прописные) буквы во всём тексте обычно применяются в заголовках и других надписях для привлечения внимания. В CSS для изменения вида текста и превращения всех букв в заглавные используется свойство text-transform со значением uppercase, как показано в примере 1.
Пример 1. Использование text-transform
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<title>Заглавные буквы</title>
<style>
h2, button {
text-transform: uppercase; /* Заглавные буквы */
}
h2 {
font: normal 1.6rem Arial, sans-serif; /* Параметры шрифта */
}
button {
padding: 0.7em 1.5em; /* Поля вокруг текста */
}
</style>
</head>
<body>
<h2>Сказка про трёх птичек</h2>
<button>Читать</button>
</body>
</html>
В данном примере в заглавные буквы преобразуется текст в заголовке <h2> и внутри кнопки <button> (рис. 1). Обратите внимание, что сам текст в HTML пишется как обычно, а через text-transform меняется способ его отображения на веб-странице.
Рис. 1. Заглавные буквы