Підключення таблиць стилів в html

Підключення таблиць стилів в html

Для чого потрібні таблиці стилів

На ранніх етапах розвитку HTML використовувалися спеціальні атрибути для зміни зовнішнього вигляду елементів. Це дозволяло керувати відступами, кольором тексту, розмірами блоків і інший стилізацією. Такий підхід був обмежений в можливостях. Інтернет не переставав розвиватися, а великі комерційні організації шукали шляхи поліпшення зовнішнього вигляду своїх сайтів, що дозволило б їм збільшити продажі і утримати увагу користувачів.

Підключення таблиць стилів дозволяє відокремити структуру документа, складену за допомогою HTML, від особливостей її візуального оформлення. Це дуже практичний підхід. Якщо у вас є сторінка з правильно складеної розміткою, ви можете змінювати її зовнішній вигляд, підключивши інший файл зі стилями.

Мова складання каскадних стилів за весь час існування знайшов масу додаткових можливостей. Він не складна у вивченні і абсолютно необхідний тим, хто хоче далі розвиватися в створенні сайтів і веб-додатків.

Підключення стилів на сторінку

зазвичай елементи розміщуються всередині . Такий підхід дозволяє логічно структурувати документи та відокремлювати основну розмітку від допоміжної.

Для визначення ставлення поточного документа і підключається файлу необхідно задати атрибут rel зі значенням stylesheet. Це явно вкаже браузеру, що вміст потрібно обробити як таблицю стилів і застосувати до поточної розмітці.

Відзначимо, що стилі можуть бути застосовані до документа і без підключення файлу. Для цього потрібно використовувати елемент ».

Нижче наводиться приклад, в якому відбувається підключення каскадних стилів, розташованих в одній папці з HTML-сторінкою. Правила стилізації наводяться відразу за розміткою. Їх потрібно розмістити у файлі з ім'ям style-exapmle.css.

Підключення таблиць стилів в html

Рис 1. Приклад використання CSS анімацій

Поділіться в соцcетях:

Схожі статті