Содержание
- 2. Содержание Знакомство с CSS Преимущество в использовании CSS Синтаксис оформления стилевых параметров Способы задания стилевого оформления
- 3. CSS CSS (англ. Cascading Style Sheets — каскадные таблицы стилей) — формальный язык описания внешнего вида
- 4. CSS Назначение CSS - установить внешний вид какого-либо элемента (фрагмента) веб-страницы; Таким образом, это правило, которое
- 5. Преимущества Разграничение кода и оформления Идея о том, чтобы код HTML был свободен от элементов оформления
- 6. Преимущества Разное оформление для разных устройств С помощью стилей можно определить вид веб-страницы для разных устройств
- 7. Преимущества Расширенные по сравнению с HTML способы оформления элементов В отличие от HTML стили имеют гораздо
- 8. Преимущества Ускорение загрузки сайта При хранении стилей в отдельном файле, он кэшируется и при повторном обращении
- 9. Преимущества Единое стилевое оформление множества документов Сайт это не просто набор связанных между собой документов, но
- 10. Преимущества Централизованное хранение Стили, как правило, хранятся в одном или нескольких специальных файлах, ссылка на которые
- 11. CSS Фактически определение стиля состоит из двух основных элементов: селектор – указатель на объект, который подлежит
- 12. CSS Селектор Сообщает браузеру, к какому элементу применяется стиль В роли селекторов могут выступать различные объекты
- 13. CSS Блок объявления стиля Код, расположенный сразу за селектором, содержит все форматирующие команды, которые нужно применить
- 14. CSS Объявление свойства Между скобками блока объявления можно добавить одно или несколько определений или форматирующих команд;
- 15. CSS Свойство Имеется достаточно большой перечень команд форматирования объектов, называемых свойствами Пример p {color: red; font-size:
- 16. CSS Значение Для каждого используемого свойства есть допустимое множество значений, которые можно применять Пример p {
- 17. Правила применения Расширенная форма записи td { background: olive; } td { color: white; } td
- 18. Правила применения Имеет приоритет значение, указанное в коде ниже Если для селектора вначале задаётся свойство с
- 19. Правила применения Значения У каждого свойства может быть только соответствующее его функции значение. Например, для color,
- 20. Правила применения Комментарии нужны, чтобы делать пояснения по поводу использования того или иного стилевого свойства, выделять
- 21. Правила применения /* Стиль сделан для ознакомительных целей */ div { width: 200px; /* Ширина блока
- 22. CSS Таблицы стилей могут быть: внутренние; внешние. В зависимости от того, где определена стилевая информация: непосредственно
- 23. CSS CSS может быть: вынесен в отдельный файл (рекомендуется); оставлен в HTML-документе, обрамленный парным тегом …
- 24. CSS Внешние таблицы стилей. Это не что иное как текстовый файл, содержащий весь необходимый набор стилей
- 25. CSS При вынесении CSS в отдельный файл: - В самом html-коде указываем ссылку на внешний файл,
- 26. CSS rel="stylesheet“ указывает тип ссылки; в данном случае это ссылка на таблицу стилей; href="style.css" задает местонахождение
- 27. CSS ВАЖНО: К веб-странице можно присоединить некое множество таблиц стилей, добавляя несколько тегов , каждый из
- 28. CSS В файле style.css прописываем: html, body { background-color: #e87474; - цвет фона страницы } h1
- 29. Пример Файл style_color.css, в котором через стили задан цвет фона страницы Файл html-страницы, в которой через
- 30. Задание Создайте HTML-файл Primer_color.html. Через CSS (вынесением в отдельный файл) задайте цвет фона страницы #a4f4a2. Сохраните.
- 31. CSS Прикрепление таблиц стилей с использованием CSS CSS имеет встроенный способ привязки внешних таблиц стилей к
- 32. CSS @import – языковая конструкция css url – выполняет привязку через указание пути к стилевому файлу,
- 33. CSS Можно создать внешний css-файл, который содержит только правила @import, выполняющие привязку других файлов внешних таблиц
- 34. CSS Внутренние таблицы стилей. Это набор стилей, часть кода веб-страницы, которая всегда должна находиться между открывающим
- 35. CSS Внутренние таблицы стилей. При включении CSS в исходный файл с помощью тега : body{ font-family:
- 36. Пример Стили находятся в самом HTML-файле, в служебной части, заключены в парный тег …
- 37. Задание Создайте HTML-файл Primer_style.html. Через CSS (записать через тег … ) задайте цвет фона страницы #a2e4f4,
- 38. CSS Внутренние таблицы стилей. Желательно размещать фрагмент кода по стилям прямо перед закрывающим тегом . Если
- 39. CSS Внутренние таблицы стилей. Иногда можно добавить стилевую информацию непосредственно к конкретному HTML-тегу (примеры по данному
- 41. Скачать презентацию