Подключение стилей CSS

Любому тегу, используемому в HTML-документе, можно задать требуемые свойства, подключив CSS. Указать стили можно методом вложения, встраивания и связывания.

Метод вложения inline

Для того чтобы задать стили на выбранном участке внутри документа, используется метод вложения.

Вложенный CSS 

<p>
  Метод вложения
    <span style="color : red">
      inline
    </span>
</p>

Метод встраивания embeding

Внутри web-страницы можно расположить каскадные таблицы стилей, которые будут действовать только внутри этого документа. Данный способ называется «метод встраивания».

Встроенные CSS 

<html>
  <head>
    <style type="text/css">
      p .red
           {
            color : red;
           }
    </style>
  </head>
  <body>
    <p>
      Метод встраивания
      <span class="red">
        embedding
      </span>
    </p>
  </body>
</html>

Метод связывания linking

Каскадные таблицы стилей лучше всего располагать во внешнем файле и подключать его ко всем документам web-сайта. Этот файл записывается с расширением .css и с наименованием, как правило, style. Для подключения CSS между тегами <head></head> указываетсятся путь к файлу с помощью тега <link>.

Как связать HTML с CSS 

Подключение документа к CSS

<html>
  <head>
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <p>
      Метод связывания
      <span class="red">
        linking
      </span>
    </p>
  </body>
</html>

Пример записи необходимых параметров внутри файла «style.css».


Содержимое файла «style.css»

p .red
	 {
		color : red
	 }