Как сделать и изменить фон на сайте

  Сделать фон для сайта из фотографии, картинки или какой либо текстуры совсем несложно. Если вы ещё не знаете как это делается, то изучив данный материал и просмотрев видео-урок, Вы шагнёте на новый этап и вам откроется простота и лёгкость понимания такого языка программирования как CSS.

 Фон сайта или любого другого отдельного элемента на странице сайта, называется бекграундом. Поэтому грамотно говорить не фон сайта, а бекграунд сайта (от английского backgraund).

Как сделать фон сайта

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

Чтобы фон сделать цветным, нужно в CSS свойствах элемента применить код:

 background-color: #000000;

Фон состоящий из двух цветов

background-image: linear-gradient(to top, rgb(249, 255, 0) 50%, rgb(3, 6, 255)50%);

Если мы хотим из трёх цветов:

background-image: linear-gradient(to top, rgb(255, 0, 18), rgb(249, 255, 0), rgb(6, 255, 0));

Изображение как фон сайта или определённого элемента на сайте

Чтобы сделать фоном сайта фотографию, картинку или любое другое изображение, используют CSS-свойство backgraund-image.

 Несколько примеров кодов применимых для паттернов:

- с путём относительно файла с кодом::

background-image: url("../images/bg.jpg");

- или можно взять изображение из ссылки:

background-image: url("http://inter-net.pro/images/bg.jpg");

- путь к изображению от корневой директории:

background-image: url("/images/bg.jpg");

Изображение на весь экран без повторов и прокрутки:

background-image: url("/images/RedHot.jpg");
background-attachment: fixed, fixed;
background-size: 100% 100%;

Прозрачный фон:

background-color: rgba(255, 255, 255, 0);

Добавить комментарий