Как Изменить Цвет Страницы и Сообщения в Блоге (А главное, стоит ли это делать)

Как поменять цвет страницы и текста в Blogger

И вот, Вы начали блог. Наконец то! Примите самые искренние поздравления  с правильно сделанным выбором. Дилемма: «Блог или не блог», всегда должна решаться в сторону позитивного варианта. Конечно блог! Не известно, как будет развиваться ваш проект и придет ли он к успеху, но попытка заслуживает право на существование.

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

Это отвратительно! По ряду причин:

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

Минимализм — наше все.

Профессиональный и успешный блог это чистый блог!

МЫ ПРОДОЛЖИМ СКОРО...

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

•  background: это сам фон, не важно чего, страницы или сообщения.
• padding: 15px; определяет на какое  значение текст отступает от краев
•  display: block; определяет монолитность содержимого, показывает браузеру, что это единый блок, одно целое.

  

  Меняем, как хотим.

  
  
  
  

Во вкладке HTML  заключаем ваш текст, который желаете получить на фоне другого цвета в такую конструкцию::
<span style="background: #7ddc1f; padding: 15px; display: block;">Ваше сообщение которое должно быть выделено.</span>

Возвращаемся обратно и проверяем:

Ваше сообщение которое должно быть выделено.

 Сообщение выделено и при помощи значения цвета в схеме шестнадцатеричного кода – hexadecimal triplet code или сокращенно HEX можно комбинировать до бесконечности. Поменяем значение цвета для фона на именной цвет Fiesta Pink #d76a8c Смотрим:

 

Ваше сообщение которое должно быть выделено.

 Цвет изменился и изменился отступ от краев, где значение padding увеличено в два раза до 30.
При желании можно усилить выделение и окружить выбранный отрывок рамкой. Рамку задает атрибут border. Рассмотрим пример:

 <span style="background:#5b92e5; border: 15px dotted #120a8f; padding: 15px; display: block;">Ваше сообщение которое должно быть выделено.</span>

Ваше сообщение которое должно быть выделено.

Получили вот такую интересную картинку. Значение dotted задает атрибуту border что выделение должно быть точками. Меняя его мы получаем разного вида рамки. Вот значения:

•  solid
• dotted
• dashed
• groove
• double
• inset
• outset
• ridge

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

• border- left   
• border-right  
• border-top   
• border-bottom

Кто знает английский, разобраться и запомнить не составляет труда. Все значения это слова из курса, как выучить английский по сериалам и проходятся в первых классах. Для наглядности рассмотрим бордюр справа:
<span style="background: #cd7f32;  border-right: 15px solid #560319; padding: 30px; display: block;">Ваше сообщение которое должно быть выделено.</span>

Ваше сообщение которое должно быть выделено.

Что заказывали то и получили. Тут нет предела фантазии и можно комбинировать с более сложными и красивыми построениями. Об этом чуть позже. А пока продолжим и обратимся к следующему способу выделения текста при помощи контейнера div.
<div style="background-color:#ffff00; color: #0073e5; padding: 35px;">
в этом случае мы так же выделяем и меняем цвет шрифта
</div>

в этом случае мы так же выделяем и меняем цвет шрифта

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