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

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


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

В редакторе сообщений Блоггер вверху справа есть 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


12 комментариев:

  1. Анонимный4/25/2015

    Пробовала воспользоваться первым примером, только ничего не вышло. Что я не так сделала . Поставила цвет DCB003.

    ОтветитьУдалить
    Ответы
    1. Возможно вы не поставили значок # перед DCB003. или удалили другие значения. Тут всё важно-чёрточки, двоеточия и пр.

      Удалить
  2. Доброго времени суток Вика! Большое тебе спасибо за все твои шпаргалочки, за знания с которыми ты делишься!

    ОтветитьУдалить
    Ответы
    1. Валентина, привет. Спасибо на добром слове. Заглядывай.

      Удалить
  3. Вика, примите от меня медальку: http://rukodelkiotmari.blogspot.ru/2015/04/blog-post_27.html#more

    ОтветитьУдалить
  4. Виктория, здравствуйте. Спасибо большое за шпаргалки. Опробовала фон на странице сообщения. Получились оба варианта. http://00149.blogspot.ru/2016/01/blog-post_28.html

    ОтветитьУдалить
    Ответы
    1. Любовь, приятно слышать и рада за Вас.

      Удалить
  5. Виктория! Здравствуйте! Сегодня я вставила фон для своей страницы в сообщении на Волшебном фонарике. ЗДОРОВО! Теперь буду иногда его использовать. СПАСИБО за шпаргалки. Я использовала ваш генератор цвета, который тоже поставила себе на блог. Очень удобно. Он всегда под рукой. На этом же блоге я создала страницы. Посмотрите мою страницу "Я-Блогер". Вы ведь не против, что я рекламирую ВАШ БЛОГ? У меня часто коллеги спрашивают, как я это или то поставила на блог и я отсылаю их к вашим шпаргалкам.

    ОтветитьУдалить
    Ответы
    1. Ирина, спасибо большое вам за отзыв. Я периодически заглядываю к Вам и на фонарик и на Ваську. По мере возможности. У Вас всё получится. а нет так разберёмся. Спасибо за ссылку намой блог. Очень приятно.

      Удалить
  6. Виктория! Спасибо за комментарий! Я написала Вам ответ в своих комментариях на Волшебном Фонарике. Это мне неудобно, вы так много для меня сделали. Дай Бог Вам здоровья и личного счастья!

    ОтветитьУдалить

Пользовательский поиск
Foto Saya
My Photo