Найти в Дзене
Rirol

Основы HTML #4

Оглавление
Основы HTML #4
Основы HTML #4

Работа с фоном

И так сегодня я покажу как можно сделать задний фон для вашего сайта. Для этого есть один очень простой метод. Метод заключается в том что бы через CSS добавить блок с цветом на задний план вашего сайта. Не пугайтесь слова CSS - это очень просто. CSS в разы проще HTML. Для того что бы нам добавить фон для сайта не обходимо создать папку с проектом и добавить туда файл style.css.

style.css
style.css

Теперь нам в коде HTML документа нужно указать путь к файлу для его прочтения. Делается это через тег <link> в нем мы указываем <... rel="stylesheet" type="text/css" href="style.css">. Выглядеть это должно примерно так:

-3

Теперь мы можем перейти в файл style.css и прописать код для заднего плана. Но перед эти поясню принцип работы CSS для начала в файле HTML нам нужно выделить блок это делается при помощи <div> & </div>.

Как это делается показано ниже

-4

После чего вы должны будете прописать в файле CSS селектор. Селектор это тот же самый тег в HTML только без угловых скобок. То есть

div {
}

После чего нужно прописать атрибут заднего плана background-color:

Обязательно после любого атрибута ставим двоеточие, каждый атрибут пишеться в {}. После прописания background-color: пишем цвет который мы хотим применить для заднего плана сайта. У меня это будет skyblue. Теперь мы можем задать высоту, ширину, положение цвета. После чего код будет выглядеть примерно так:

div {
background-color: skyblue; width: 600px; height: 610px; position: absolute;
}

И теперь можно посмотреть что у нас получилось

-5

Получается не совсем ровно, но это можно с легкостью откорректировать.

Заключение

Сегодня я показал вам как с лёгкостью и небольшим знанием язык можно быстро написать простую страницу и разнообразить её. Результат после корректировки можете лицезреть ниже. А я с вами не прощаюсь ещё спишемся.

-6