Изменить фон сообщения в блоге.

Всем доброго времени суток. Здравствуйте друзья, читатели и гости блога. Очень рада видеть у себя новых посетителей. Спасибо вам всем за то, что читаете мои шпаргалки. Хочу отметить, что очень многие только делают первые шаги в блогосфере. И в связи с этим вопросов по ведению и оформлению блога достаточно.


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

В редакторе сообщений Блоггер вверху справа есть 2 функции создать и HTML. Для того чтобы выделить отдельным фоном конкретное сообщение нужно перейти в режим  HTML. И там установить вот такой код.

<div style="background-color: #444; color: #fff; padding: 10px;">
здесь текст вашего сообщения.
</div>

background-color: #444-это цвет самого фона. Вы можете воспользоваться для подбора цвета этим генератором.  Просто поменяйте значение #444 на своё.

color: #fff - это цвет шрифта.

В строке, которую я выделила синим цветом, сам текст. Посмотрите на скриншоте, как это выглядит.

Принцип я думаю понятен. Весь текст мы расположили между тегами <div></div> и задали свои стили.

 Вот что  получается. Картинки вставляем обычным способом.

Красивым быть - не значит им родиться,
Ведь красоте мы можем научиться.
Когда красив душою Человек -
Какая внешность может с ней сравниться?

Подобным образом в качестве фона можно использовать любое изображение, картинку. Для этого берём следующий код.

<div style="background: url( Здесь адрес вашего изображения.); background-size: cover; color: #000; padding: 10px;">Здесь текст сообщения
</div>

Результат .

Сорванный цветок должен быть подарен, начатое стихотворение - дописано, а любимая женщина - счастлива, иначе и не стоило браться за то, что тебе не по силам.

Обратите внимание на цвет шрифта - color: #fff; в первом варианте и color: #000; -во втором. Если ваш цвет фона будет светлым или тёмным, то, конечно же, эти значения нужно поменять. В качестве фона можно сделать и видео. Но об этом поговорим позже.

И чтобы не писать отдельный пост, посмотрите как сделать фон для картинки.

Вот такой код вставляем при написании сообщения в режиме HTML

<style>#izo {
 height: 25em;
 line-height: 25em;
 text-align: center;
 background:pink ;
}
#izo img {
 vertical-align: middle;
}
</style>

<div id="izo"><img src=" Адрес вашего изображения"></div>

Картинка будет лучше смотреться на фоне, если у неё убрать рамку. Как это сделать в Блоггере читайте этот пост. При написании сообщения фон виден не будет. Результат отобразится после публикации.

Вот и всё. Вопросы задавайте в комментариях. Ещё раз спасибо за внимание. Удачи всем.

здесь можно оформить подписку на новые шпаргалки

Введите Ваш email