CSS - Промежуточные итоги

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

Код, представленный ниже, демонстрирует все свойства CSS, описанные в предыдущих разделах данного учебника. Если сохранить его как CSS файл, то можно понять действие каждого свойства CSS и то, каким образом они работают. Лучший способ полностью разобраться во всем – это немного поэкспериментировать с файлами HTML и CSS и посмотреть, что происходит, если что-нибудь изменить.


body {
   font-family: arial, helvetica, sans-serif;
   font-size: 80%;
   color: black;
   background-color: #ffc;
   margin: 1em;
   padding: 0;
}

/* Кстати, это комментарий */

p {
   line-height: 1.5em;
}

h1 { 
   color: #ffc;
   background-color: #900;
   font-size: 2em;
   margin: 0;
   margin-bottom: 0.5em;
   padding: 0.25em;
   font-style: italic;
   text-align: center;
   letter-spacing: 0.5em;
   border-bottom-style: solid;
   border-bottom-width: 0.5em;
   border-bottom-color: #c00;
}

h2 {
   color: white;
   background-color: #090;
   font-size: 1.5em;
   margin: 0;
   padding: 0.1em;
   padding-left: 1em;
}

h3 {
   color: #999;
   font-size: 1.25em;
}

img {
   border-style: dashed;
   border-width: 2px;
   border-color: #ccc;
}

a {
   text-decoration: none;
}

strong {
   font-style: italic;
   text-transform: uppercase;
}

li {
   color: #900;
   font-style: italic;
}

table {
   background-color: #ccc;
}