Как изменить фон сайта WordPress, Blogger, Tumblr

как изменить фон на своем сайте или блоге

Здравствуйте дорогие читатели. Сегодня мы с вами разберем еще один урок для улучшения дизайна вашего сайта. Урок этот не сложный и довольно интересный.

Как известно на вкус и цвет сайты и блоги бывают разные. Кому-то нравится белый фон, кому-то темный, а некоторым и вовсе хочется примостить там шикарное изображение. Чего только не сделаешь чтобы удержать посетителя.) Вчера я поделился с вами уроком, как украсить сайт под новый год фоновой картинкой. К чему это я виду, а виду я к тому, что вчерашний и сегодняшний уроки похожи между собой, вот только код, который при этом используется немного изменит свой вид. К примеру вчера у нас была картинка, которая должна была примоститься по бокам полотна. А сегодня за основу будет браться цвет или изображение, которые должны замостить вес фон вашего сайта или блога. В общем с теорией более менее понятно, можно перейти к практике.

Как поменять фон блога. Добавляем картинку или цвет


Для того, чтобы поменять фон сайта или блога используем следующий CSS код:

body {
background: #333 url()no-repeat center center fixed;
-webkit-background-size: cover;
 -moz-background-size: cover;
-o-background-size: cover;
background-size: cover;}

За цвет фона отвечает участок кода выделенный оранжевым. Вместо него пропишите код своего цвета и сохраните шаблон.

Переходим к просмотру видео:


Если же вам нужно разместить фоновое изображение, в таком случае удалите оранжевый участок кода и рядом в коде выделенном зеленым в дужках разместите ссылку на свое изображение.

Можно загрузить картинку на какой нибудь хостинге картинок и скопировать прямую ссылку на нее. Так же можно загрузить картинку в Сообщение Blogger, или Запись WordPress, что намного лучше. Для этого создаете новое Сообщение, или Запись, загружаете нужную картинку, переходите на вкладку HTML, там копируете ссылку изображения и вставляете ее в наш код. При этом сообщение можно не публиковать, просто оставить, как черновик. Как это делается можно посмотреть на видео. 

Еще пример по смене фоновой картинки HTML сайта 

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


Поделиться в социальных сетях:
Facebook Twitter Vkontakte

Рекомендуем

Отправить комментарий