CSS - Cascading Style Sheets (каскадные таблицы стилей) появились в 1996 году, когда у меня даже ещё компьютера не было. Первый же комп я купил где-то году в 2000, конечно, б/у, и это был комп с процессором Пентиум 1 (остальные характеристики уже не помню).
А первый свой сайт я создал года три спустя. И, конечно, ни о каких CSS я тогда не знал, хотя они, как вы понимаете, уже давно существовали. И вообще, поскольку сайты для меня - это не профессия, а развлечение, то впервые использовать CSS я стал довольно поздно, когда это уже вовсю применялось во всём мире. Однако сегодня даже очень простенький документ без CSS трудно себе представить. Поэтому, если вы начинающий верстальщик, и ещё не пробовали CSS, то пора уже начинать. И я сегодня приведу небольшой пример.
Итак, стили CSS можно хранить в отдельном файле, можно определить в каждом HTML-документе, а можно и для отдельного HTML-элемента (например, для абзаца или ссылки).
Сегодня как раз о том, как определить стили для документа. Стили в таком случае можно разместить внутри тега <head>, заключённые в собственный тег <style> (он тоже парный, то есть имеет закрывающий тег). Ну и внутри тега <style> можно определить стили для нужных вам HTML-элементов. Пример:
В нашем примере мы определили цвета для заголовков H1 и H2, а также некоторые параметры текста, который будет находиться внутри всех тегов <p>, имеющихся в документе. Подобным образом можно определить стили для всех элементов. Вообще CSS посвящены целые книги, так что на этом пример закончен. Расскажу только о некоторых особенностях, которые вы могли здесь заметить.
Во-первых, почему <style type="text/css">? Разве нельзя просто написать <style>?
Можно. И в большинстве браузеров всё будет работать. Но кроме CSS существуют и другие таблицы стилей, которые очень плохо поддерживаются и потому почти не используются. Однако они есть. Поэтому лучше указать конкретные таблицы (в нашем случае CSS).
Во-вторых, зачем определение стилей заключено в комментарии? Это тоже необязательно, но желательно. Потому что теоретически у пользователя может оказаться очень старый браузер (или какой-нибудь самописный), который не поддерживает CSS. В таком случае он не распознает тег <style>. Такой браузер не выведет на экран сам тег (потому что это хоть и не распознанный, но тег), а вот всё, что находится внутри этого тега, будет выведено на экран. Поэтому стили на уровне документа лучше заключать в комментарии (комментарии понимают даже очень старые браузеры), чтобы они гарантированно не отображались на экране.
На этом всё. Подписывайтесь на канал, чтобы ничего не пропустить.