Як підключити таблицю стилів css до html

За кілька років в інтернеті я знайшов для себе ряд корисних сайтів і сервісів, які не мають прямого відношення до сайтобудування і взагалі темі цього блогу, але я просто хотів би порекомендувати їх і вам:

Кешбек сервіси. такі як Epn.bz і Летішопс. Перший дозволить заощадити до 15% на Аліекспресс, а другий скупитися з Кешбек більш ніж в 1000 інтернет-магазинів. Пошук авіаквитків, просто відмінний сервіс - Aviasales.ru. Шукає по сотням сайтів і видає всі варіанти авіаквитків, можна вибирати найдешевші або ті, де менше час у дорозі. Також у них відмінне моб. додаток і браузерні плагін.

Для цього в вміст тега потрібно вставити наступний рядок:

Пояснюю: Тег link дозволяє підключати до сторінці зовнішні файли. Атрибут rel = "stylesheet" дає інструкції, що підключається файлом є саме таблиця стилів. Href - це шлях до файлу стилів. Як правило його значення "style.css" якщо таблиця стилів називається саме так і лежить в одній папці з html-сторінкою, для якої вона підключається.

Як прописати шлях до файлу

Відповідно, якщо css-файл лежить десь в іншому місці, то шлях до нього прописується по іншому. Приклади, щоб вам було зрозуміліше:
Файл table.css лежить в папці styles. яка знаходиться в тій же папці, що і html-сторінка: href = "styles / table.css"
Файл fonts.css лежить в папці styles. яка знаходиться в папці css. а та в свою чергу знаходиться там, де і html-сторінка: href = "styles / css / fonts.css"

Дві точки дозволяють у вказівці шляху повернутися назад від початкового місця (від місця, де знаходиться наша html-сторінка). Так що дотягнутися можна так:
Href = "../style.css" - файл лежить на один рівень вище html-файлу.
Href = "../../style.css" - на два рівні вище.
Href = "../../../css/style.css" - на три рівні вище + сам файл стилів лежить ще й в папці css.
Сподіваюся, цих простих прикладів вам зрозуміло, щоб повністю розібратися з тим, як поставити шлях до файлу.

застарілий атрибут

Раніше при підключенні таблиці стилів потрібно було також вказувати в тезі link атрибут type = "text / css". але сьогодні це вже не є обов'язковою вимогою - браузери і так прекрасно все розуміють. Втім, для повноцінної підтримки в старих браузерах можна перестрахуватися і все ж дописати його.