#Урок 2. Как подключить таблицу стилей?

И так, в уроке 1 мы видели CSS в действии. Но стили у нас находились в том же документе т.е. в index.html — но это не очень удобно, особенно если страница большая, то размещая все элементы в одном файле будет очень проблематично. Поэтому в данном уроке мы научимся подключать, так сказать внешнею таблицу стилей. Для этого создаем два файла: index.html и style.css в одной папке.

И так открываем файл index.html в NotePad++ и вставляем в него следующее:

<html><br >
  <head><br >
    <title>Пример работы CSS</title><br >
<br >
      <!-- Подключаем CSS. После href= в кавычках путь к файлу --><br >
      <link rel="stylesheet" type="text/css" href="style.css"><br >
<br >
  </head><br >
  <body><br >
<br >
<h1>Заголовок h1</h1><br >
<h2>Заголовок h2</h2><br >
<br >
  </body><br >
</html>

Еще раз обращаю ваше внимание на то, что строка <link rel="stylesheet" type="text/css" href="style.css"> - это и есть подключение таблицы стилей.

А теперь открываем с помощью NotePad++ файл style.css и вставляем в него следующий код:

body{<br >   background: gray;<br >   color: white;<br > }<br > h1{color:#0085cc;}<br > h2{color:white;}

 

Теперь все это сохраняем и открываем файл index.html в браузере и если вы все сделали верно то получиться должно следующее:

Урок 2 можно считать оконченным.

Комментарии закрыты.