Blogger як змінити рамку і фон зображення в blogger

Blogger як змінити рамку і фон зображення в blogger

Дивно, але спочатку Blogger налаштований так, що при завантаженні зображення, створює навколо нього досить широку рамку. Причому, змінити параметри рамки вбудованими інструментами, сервіс не дозволяє. Деякі блогери радять додати свій стиль CSS для окремих зображень. Це можна зробити на вкладці "шаблон", кнопка "Змінити HTML". Я ж не бачу необхідності залишати взагалі рамки, тому просто прибрав її в існуючому стилі.

Допускаю, що в різних шаблонах може бути різний код, відповідальний за редагування рамки і фону завантаженого зображення, тому буду відразу вказувати назву шаблону. Частина коду шаблону, що містить ".post-body img," вказує на те, що саме тут задається CSS-стиль рамки і фону зображення. Такий код можна знайти за допомогою панелі управління Blogger, на вкладці "шаблон", кнопка "Змінити HTML". У шаблоні "Водяний знак" (watermark), включаючи всі його стилі, код міститься в умовному розділі / * Widgets * /.

post-body img. post-body .tr-caption-container. Profile img. Image img,
.BlogList .item-thumbnail img padding: 5px;
background: #fff;
-moz-box-shadow: 1px 1px 5px rgba (0, 0, 0. 5);
-webkit-box-shadow: 1px 1px 5px rgba (0, 0, 0. 5);
-goog-ms-box-shadow: 1px 1px 5px rgba (0, 0, 0. 5);
box-shadow: 1px 1px 5px rgba (0, 0, 0. 5);>
.post-body img. post-body .tr-caption-container padding: 8px;>

Редагування рамки зображення
Якщо фон картинки налаштовується в один тон із зовнішнім фоном, то візуально зміна розміру рамки ми не побачимо, тому спробуйте спочатку визначитися саме з нею. Ширина рамки встановлюється рядками padding: 5px; і padding: 8px ;. Встановивши значення 0px замість 8px, рамка зведеться до нуля. Ефект тіні рамки зображення можна відредагувати в рядку "box-shadow: 1px 1px 5px rgba (0, 0, 0. 5);". Три параметра в пікселях відповідають за величину бічної, нижньої тіні і за її розмитість. Rgba змінює колір.


P.S. Якщо для логотипу у вигляді тексту на прозорому тлі, в разі злиття з загальним фоном ефект тіні рамки виглядає не кращим чином, то для інших зображень, навпаки, тінь б прикрасила зовнішній вигляд. Однак зміни в шаблоні застосовуються до всіх картинок. Для окремих зображень можна додати свій стиль CSS, на вкладці "шаблон", кнопка "Змінити HTML".

Дякую за вашу оцінку!

Схожі статті