Язык стилей CSS не связан с HTML напрямую. Необходимо указать браузеру, откуда нужно загрузить и интерпретировать стили. Для этого есть три способа:
style
. Такую запись называют «инлайн» (inline), что означает запись правила в одну строку с использованием атрибута style
.<style>
, который указывают в секции head
. Браузер обработает всё, что написано внутри этого тега как CSS код.css
, в котором записываются CSS правила. Для подключения файла используется мета-тег <link>
В этом уроке рассмотрим принцип инлайн записи стилей с помощью атрибута style
. Какой бы способ подключения стилей вы не выбрали, синтаксис правил остаётся неизменным: название-свойства: значение;
. Важно не забывать добавлять символ ;
после значения свойства. Так браузер сможет отделить правила друг от друга.
Один из основных способов «попробовать» стили — работа с текстом. CSS позволяет оформлять текст множеством способов: увеличивать размер шрифта, определять начертание, насыщенность и так далее. Все основные правила для работы с текстом рассматриваются в течениe всего курса.
Научимся менять размер шрифта. Размер можно изменить с помощью свойства font-size
, значением которого является число и единица измерения. Попробуем сделать текст размером 32 пикселя. Единица измерения пиксель обозначается с помощью сокращения px
. Подробнее про различные единицы измерения и то, как они работают, будет рассказано в следующих уроках
<p style="font-size: 32px;">Большой текст</p>
Большой текст
Добавьте в редактор тег <p></p>
и, используя атрибут style
, установите размер шрифта в 12 пикселей.
Если вы зашли в тупик, то самое время задать вопрос в «Обсуждениях». Как правильно задать вопрос:
Тесты устроены таким образом, что они проверяют решение разными способами и на разных данных. Часто решение работает с одними входными данными, но не работает с другими. Чтобы разобраться с этим моментом, изучите вкладку «Тесты» и внимательно посмотрите на вывод ошибок, в котором есть подсказки.
Это нормально 🙆, в программировании одну задачу можно выполнить множеством способов. Если ваш код прошел проверку, то он соответствует условиям задачи.
В редких случаях бывает, что решение подогнано под тесты, но это видно сразу.
Создавать обучающие материалы, понятные для всех без исключения, довольно сложно. Мы очень стараемся, но всегда есть что улучшать. Если вы встретили материал, который вам непонятен, опишите проблему в «Обсуждениях». Идеально, если вы сформулируете непонятные моменты в виде вопросов. Обычно нам нужно несколько дней для внесения правок.
Кстати, вы тоже можете участвовать в улучшении курсов: внизу есть ссылка на исходный код уроков, который можно править прямо из браузера.