Как вставить файл CSS в HTML

Язык гипертекстовой разметки (HTML) определяет, какие элементы присутствуют на веб-странице. Язык программирования «Каскадные таблицы стилей» (CSS) описывает, как должны выглядеть эти элементы. Файл CSS можно добавить в HTML в качестве внешней (CSS добавляют в виде отдельного файла) или внутренней таблицы стилей (CSS включают в файл HTML). Узнайте, как вставить в HTML файл CSS, чтобы изменить дизайн сайта.

Метод 1

Метод 1 из 2:

Как уставить внешнюю таблицу стилей

Загрузить PDF

Подготовьте и сохраните файл CSS с расшиернием «.css».
3
Скопируйте адрес (URL) файла CSS. Адрес сайта будет выглядеть как-то так: www.yoursite.com/stylesheet.css.
- Хорошей практикой является удаление из адреса (URL) основного имени домена. Исходя из этого, адрес http://мойсайт.com/css/default.css будет сокращен до «/css/default.css». Не забудьте включить ведущий слэш («/»). Он называется относительным путем.
Найдите в файле HTML метку </head> и создайте пустую строку прямо над ней. Вставьте в эту строку <LINK rel=stylesheet type="text/css" href="www.ваш_сайт.com/stylesheet.css">, заменив «www.ваш...» на ссылку в файле CSS.
В противном случае снова откройте файл HTML, найдите ошибки и внесите изменения.
Реклама

Метод 2

Метод 2 из 2:

Как вставить внутреннюю таблицу стиля

Загрузить PDF

1
Создайте метку <style>. Откройте файл HTML и найдите метку </head>. Добавьте над ней несколько пустых строк и введите следующее:

<STYLE type="text/css"></STYLE>

How.com.vn Русский: Add a CSS File to HTML Step 7

В противном случае внесите нужные изменения.
Реклама

Советы

Всегда проверяйте внешний вид сайта в разных браузерах и на разных операционных системах. Некоторые браузеры подключаются к CSS немного по-разному. Это даже может произойти в одном и том же браузере, но на разных версиях Mac и Windows. Если в другом браузере ваш сайт выглядит иначе (например, промежуток между некоторыми объектами, такими как списки, имеет другой размер), тогда проблема заключается в настройках этого браузера. Найдите таблицу мастер-стилей и вставьте ее в начало файла CSS, чтобы изменить стандартные настройки браузера. Это делается для того, чтобы ваши настройки ничего не меняли в самом браузере.
Вставьте внешнюю таблицу стилей, если у вас есть такая возможность. Это позволит вам менять внешний вид сайта, изменяя код в исходном файле. Так вам не придется менять CSS на каждой странице сайта.
Если сайт не реагирует на CSS так, как вы того ожидали, перепроверьте всю кодировку, чтобы удостовериться в правильности ее написания. В частности, уделите особое внимание точкам с запятыми («;») и закрывающимся скобкам («}»). В CSS файле довольно просто пропустить один из этих символов.
Сохраните файл HTML на компьютер, чтобы потом открыть его в различных веб-браузерах и перепроверить его внешний вид перед дальнейшей загрузкой. Но чтобы его загрузить, файл CSS необходимо вставлять в HTML в качестве внешней таблицы стилей.
Если таблица стилей сама себе противоречит – например, сначала в ней говорится, что текст будет синим, а затем, что он будет красным – выполняться всегда будет последнее условие. Если одна команда представляет собой внешнюю таблицу стилей, а другая – внутреннюю, активной будет внутренняя таблица.

Предупреждения

Не используйте «открытую» постановку CSS, то есть CSS, который включен в метку HTML. (Пример: «align='center'» является открытой постановкой CSS). Это устаревший вариант с плохой синтаксической конструкцией. Если через некоторое время вам придется обновлять сайт, эту постановку будет трудно изменить.