Лабораторные работы CSS3.
Web-legko.ru
Лабораторная работа №1. «Подключение стилей CSS к сайту» Цель работы: Изучить способы подключения стилей CSS к сайту.
В данной лабораторной работе рассматриваются способы подключения стилей CSS3 к сайту. Существует
три способа подключения стилей к сайту.
Первый способ используется больше для обучения или для минимального изменения свойств отдельного
тега, он увеличивает вес страницы и тем самым увеличивает время загрузки страницы, помимо этого увеличивает
количество кода, что существенно усложняет работу с ним. Этот способ предполагает написание стилей в
атрибуте тега style (пример
).
Второй способ используется чаще чем первый, он подходит если используется небольшое количество
стилей, либо когда возникает необходимость на отдельной странице сайта подключить стили не используемые
больше нигде на сайте. Стили во втором способе подключаются к странице в части с
использованием тега в части .
Второй способ подключения стилей является более распространенным, он позволяет создать стили для
каждой отдельной страницы используя парный тег .
Синтаксис
Лабораторные работы CSS3.
Web-legko.ru
Color: white; Данный способ добавляет некоторую универсальность стилям, т.е. стили написанные таким способом
будут применяться к соответствующим тегам на всей странице. Данный способ немного увеличивает весь
страницы и соответственно увеличивает время загрузки. Данный способ подходит в том случае, если вы хотите
оформить какую либо страницу вашего сайта определенными стилями, которые не будут повторяться на других
веб страницах сайта. Основное что следует запомнить это то что данные стили будут применяться только на той
странице в коде которой в части HEAD он будет написан.
Способ 3. Подключение внешнего файла со стилями CSS.
Данный способ является универсальным и самым распространенным. Он позволяет создать стили CSS в
отдельном текстовом документе, который имеет расширение .css (например: style.css). Плюсы данного способа в
том что все стиле для всего сайта записываются в одном документе, что существенно облегчает дальнейшую
работу с внешним видом сайта. На сайте всегда присутствуют элементы которые на всех страницах сайта
отображаются одинаково (например это может быть меню, шапка, подвал, какие либо кнопки и прочие
элементы).
Подключение внешнего файла CSS
(Подключение файла стилей с стороннего сайта) (Подключение файла стилей из директории сайта) Значение атрибута тега — rel остаётся неизменным независимо от кода, как приведено в данном
примере.
Значение атрибута href задаёт путь к CSS-файлу, он может быть задан как относительно, так и абсолютно.
Таким способом есть возможность подключать стили с другого сайта.
Практическое задание
1. Создайте страницу HTML, назовите ее index.html.
2. В данном документе напишите «скелет» странцы HTML
Практическая работа «Подключение CSS к сайту»