Привет, друзья. Хочу показать как очень просто изменить общий фон всего блога. Хотя сам фон можно легко настроить в разделе Тема. Там можно подобрать готовые фоны или залить свою картинку и сделать соответствующие настройки. Однако, решила вам предложить более лёгкий вариант, на мой взгляд. Здесь мы сами сможем регулировать размер фоновой картинки. Вернее её ширину.
Перейдём к делу. Изначально мой тестовый блог выглядел так. Я отметила пространство (или задний фон всего полотна), который задан был в настройках темы.

Сейчас мы его поменяем на такую картинку

Чтобы получилось примерно вот так

Здесь я хочу обратить ваше внимание. Ширина блога в моём случае 1200 px. Размеры фоновой картинки 1450 на 950 px. Картинка заполнила полностью всё пространство.
Если размеры фоновой картинки будут меньше размера всего полотна блога, то она не закроет всё пространство и будет выглядеть в виде бордюра. Посмотрите разницу

Оно, вроде как, тоже вполне приемлемо. Некоторые таким образом украшают сайты к праздникам. В любом случае рассмотрим оба варианта. При правильно подобранном или созданном в любом редакторе фоне и тот и другой вариант можно подогнать.
Особых навыков не нужно.
1. Подберите нужную картинку и скопируйте её адрес.
2.Копируйте приведённый ниже код и устанавливаете адрес своей картинки
body {
background: url(здесь адрес картинки)
no-repeat top fixed;
}
background: url(здесь адрес картинки)
no-repeat top fixed;
}
3. Идём во вкладку Тема - Изменить HTML находим ]]></b:skin> и устанавливаем над этой строкой готовый код.
Результат будет виден при просмотре темы. Если вы остались им довольны смело нажимайте сохранить и любуйтесь новым шаблоном.
Опять же повторюсь. На тот случай если картинка оказалась меньше размеров ширины блога или вообще спряталась с глаз долой, нужно в коде задать значение ширины. Добавим всего одну строчку и он выглядел так
body {
background: url(http://www.clipartbest.com/cliparts/9iz/EnR/9izEnR56T.png)
no-repeat top fixed ;
background-size: 100%;
}
background: url(http://www.clipartbest.com/cliparts/9iz/EnR/9izEnR56T.png)
no-repeat top fixed ;
background-size: 100%;
}
Со значением background-size: 100%; можно поиграться, меняя его на меньшее, пока не добьётесь желаемого.
Такими простыми манипуляциями можно создавать разные фоны под разные праздники, времена года или ваше настроение.
Возможно Вы пропустили
Как сделать фоновое изображение на CSS
Постоянно меняющийся фон страницы
Шаблон блога на всю ширину страницы
Всем добра и до встречи.
Интересно, Виктория! Потом ещё подробно почитаю на компьютере.
ОтветитьУдалитьИрина, попробуй конечно. К котикам можно вообще интересные картинки подобрать.
ОтветитьУдалитьвидимо на сторонних шаблонах не хочет работать,у меня он сел на верхушку только,а жаль
ОтветитьУдалитьМонетка, сторонние шаблоны на то и сторонние. не знамо кем писанные и как. Код только для шаблонов Блоггер.
ОтветитьУдалитья столько времени скала как этот фон сменить,так обрадовалась,но не получается.Теперь понятно почему.
ОтветитьУдалитьГлянул. Действительно, даже для меня, никудышного блогера, не сложно. Подумал. А дай-ка я сделаю фон голубым! Подумал ещё раз, и решил, что кое-кто не так поймет. Конечно, в моём возрасте проблема не то, что бы актуальна, но всё таки... И спасибо за рекомендацию.
ОтветитьУдалитьСемён, хоть серобуромалиновым. Умный не скажет, дурак не поймёт.
ОтветитьУдалитьдовольно интересно, спасибо
ОтветитьУдалитьИ главное очень просто
Удалить