Как красиво оформить изображения/картинки в блоге
Обновлено: 14.06.2020 г
Здравствуйте гости и читатели. Любой владелец блога/сайта никак не сможет обойтись без изображений/картинок на своих ресурсах. И сегодня мы будем учиться эффектно оформлять изображения на страницах наших блогов. Тем более, что это совсем не трудно, справится даже начинающий блоггер.
Итак, поехали на урок: в редакторе blogger, где Вы обычно пишите свои посты, загружаете картинку, нажав на значок изображения.
Вот моя картинка
Переходим на вкладку HTML слева или в новом дизайне справа значок < >. Здесь мы должны скопировать URL адрес изображения
Скопируйте URL адрес, выделенный оранжевым, начинается с <a href и.т.д. Перечеркнутый синим копировать не надо. Затем этот адрес надо вставить вот в этот код:
<img src="https://2.bp.blogspot.com/-hNZDEVoexdo/U3VnLn7dvlI/AAAAAAAAEUk/cFkHFVTmkIk/s1600/068.JPG" style="background-color: #ffffff; border: 3px groove #26dbff; margin-left: auto; margin-right: auto; padding: 1px;" />
Выделенное коричневым-URL адрес изображения; синим-толщина и цвет границ рамки; выделенное фиолетовым-этот код цвета подбирайте под цвет границ рамки (если цвет будет сильно отличаться будут светлые полосы).
Исключение двойная рамка (dooble), здесь цвет должен быть светлее. Какие бывают формы рамок читайте в этом сообщении.
Далее удаляете картинку и вставляете код с адресом URL картинки в режиме HTML, задаете форму и цвет границ, нажимаете создать, и получаете красиво оформленное изображение.
Исключение двойная рамка (dooble), здесь цвет должен быть светлее. Какие бывают формы рамок читайте в этом сообщении.
Далее удаляете картинку и вставляете код с адресом URL картинки в режиме HTML, задаете форму и цвет границ, нажимаете создать, и получаете красиво оформленное изображение.
А это картинки для примера. Здесь все формы границ рамок, кроме dotted (точечная) и (dashed) пунктирная.
 |  |
Можно в код перед border:3px; добавить закругление углов border-radius: 12px; получим картинку в рамке с закругленными краями. Здесь у меня будет не видно, так как в блоге установлен виджет автоматического закругления углов всех изображений.
 |  |
Как видим ничего сложного нет. Оформляйте Ваши изображения в блогах, не ленитесь. Тем более, что красивый дизайн и эффектно оформленные изображения и виджеты, очень хорошо запоминаются. И будьте уверены, посетитель обязательно запомнит Ваш блог и вернется.
Статья в тему: Оформление изображений в блоге с использованием CSS стилей;
Творческих Вам Успехов. До свидания и до новых встреч на страницах моего блога.
Рекомендуемый контент:
