Выделение текста в блок рамки с цветовой тенью



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

Можно оформить для одной страницы выделение текста, в редакторе blogger перейти по вкладке HTML и вставить код рамки или для всех страниц, вставить код CSS в шаблон блога в разделе <b:skin></b:skin. Ниже стиль CSS и сразу пример выделенного кода:

.gradient {
padding:20px;
 margin: 10px;  
box-shadow:-1px -2px 37px rgba(63, 175, 133, 1);
-webkit-box-shadow:-1px -2px 37px rgba(63, 175, 133, 1);
font-size: 14px;
}

Для отдельной страницы необходимо заключить CSS в <style>код CSS</style>. Затем для выделения заключите нужный текст в редакторе по вкладке HTML:

<div class="gradient">здесь текст или код</div>

Для еще более быстрого выделения текста, стиль CSS вставить цитатой, как у меня в одном из блогов, скриншот:

Стиль CSS блока рамки с цветовой тенью в шаблоне блога блоггер

Находите в шаблоне с CSS стилях .post-body blockquote { далее вставьте стиль CSS, просмотрите и сохраните шаблон. Затем в редакторе на странице выделите нужный текст и сверху в меню нажмите значок Цитата. В этом варианте также есть возможность оформления для всех и для одной страницы.

Шаблоны у всех разные, поэтому мой пример может и не поддерживаться. Тогда пробуйте варианты: .blockquote{ или #blockquote{...

Почитайте похожие статьи для оформления текста в блоге:

Цвет тени Вы можете изменить на свой, в помощь конвертер цветов. По всем вопросам обращайтесь в комментариях или в меню форма для связи. Спасибо, что читаете мои статьи. Всего доброго.
TEXT.RU - 100.00%


Автор статьи ✎ Olga Protasova Выпуск ✹ 2/02/2017 Ярлыки ►


Открыть комментарии →

4 коммент. :

  1. Простите, но я не понял. Куда нужно кидать код, если мне надо, чтобы мои сообщения (в том числе их краткие версии на главной странице) окаймлялись такой тенью? </b:skin или я ошибаюсь?

    ОтветитьУдалить
    Ответы
    1. Владимир Яковлев, Вы не ошибаетесь, вставьте код в шаблон блога выше строки ]]></b:skin

      Удалить
  2. Здесь вопрос не печатается. Поточу-что отвечает мне "Ваш код HTML не может быть принят: Недопустимый тег: STYLE". Оля, я задала вопрос в Google+

    ОтветитьУдалить
    Ответы
    1. Татьяна Ямскова, в сообществе на вопрос Вам Вика ответила.

      Удалить


 
Технологии Blogger.

Форма для связи

Имя

Электронная почта *

Сообщение *