Каскадные таблицы стилей (CSS) используются для установки стиля на веб-страницах, которые содержат элементы HTML. Они устанавливают цвет фона, размер шрифта и т.д.
Существует три способа написания CSS для веб-страницы.
Три способа использования CSS:
- Встроенные стили: размещаются внутри элементов HTML.
- Внутренние стили: размещаются в разделе заголовка веб-страницы.
- Внешние стили: размещаются на внешней таблице стилей, которая представляет собой отдельную страницу, связанную с веб-страницей.
Встроенные стили
- Встроенные стили помещаются в элемент HTML в коде;
- Когда вы используете встроенный стиль, ваш стиль будет влиять только на выбранный вами элемент;
- Встроенные стили не имеют селекторов, потому что они написаны внутри элемента html.
Пример:
<p style=”color: red”>Text Here</p>
Внутренние стили
- Размещаются в разделе заголовка веб-страницы, которую вы пишете, с помощью тега стиля <style type=”text/css></style>;
- Написанные вами стили будут использоваться только для веб-страницы, на которой вы их использовали;
- Внутренние стили также называют «встроенными стилями».
Пример:
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title> FahadStein </title>
<style type=”text/css>
p {
color: red;
font-size: 14px;
}
</style>
</head>Внешние стили
Внешние стили можно повторно использовать для применения на нескольких страницах, просто связав таблицу стилей с веб-страницей.
Напишите свои CSS-коды с помощью любого из редакторов кода, а затем сохраните его в виде файла .css. Затем свяжите таблицу стилей с HTML-страницей, добавив этот код в раздел head:
<link href=”StyleSheetLocation/StyleSheetName.css” rel=”stylesheet” type=”text/css>
Не забудьте изменить местоположение таблицы стилей и name.css таблицы стилей на реальное местоположение и имя созданной вами таблицы стилей.
