Закруглить углы картинки

Как округлить углы изображения в блоге на Blogger

  Это может быть полезно любому желающему кто захочет сделать закругление углов изображения в своем блоге.
Zakruglenie uglov izobrzheniya
  Для автоматизации процесса есть проверенный скрипт который генерирует код border-radius и позволяет осуществлять округление углов изображения. Закругление углов картинки при этом создаётся кроссбраузерное и будет работать даже в старых версиях Opera, Chrom, IE, Mozila. Для этого вам в коде скрипта необходимо указать число желаемого округления углов картинки в пикселах. Далее в заходим в свой блог "Дизайн" - "Добавить гаджет" - "HTML/JavaScript", вставляем там получившийся код. Чтобы гаджет не "светился" заголовок оставляем пустым. Готово: закругление углов изображения выполнено.
  В любой момент можно удалить гаджет и округление углов изображения вернется к старым настройкам. Так же код можно вставить в шаблон если первый вариант вам не подошёл (только обязательно сохраните перед изменением старый вариант шаблона).

Степень закругления углов рамки: 12px
Вставляем в гаджет следующий код:

<!-- Код для закругления углов изображений -->
<style>
.post-body img
{
padding: 8px;
background: #ffffff;
border: 1px solid #b6b5b5;

-webkit-border-radius:12px!important;
-moz-border-radius:12px!important;
 border-radius:12px!important;
}
</style>
<!--/Конец кода для закругления углов изображений -->

   Кодом предусмотрено закругление углов  картинки в 12 пикселов (12px). Заменив на нужное значение все дюжины, выделенные красным цветом, можно сделать округление углов  картинки больше или меньше.
  Дополнительно в коде присутствуют ещё полезные переменные для рамки с бордюром вокруг изображения:
padding: 8px; - ширирина рамки вокруг изображения.
background: #ffffff; - цвет рамки вокруг изображения.
border: 1px solid #b6b5b5; - 1px - ширина, solid - вид (стиль) и #b6b5b5 - цвет границы (бордюра) рамки вокруг изображения.
  Если рамка с бордюром вокруг изображения не нужны, то сделайте их ширину равную нулю. Тогда рамка с бордюром исчезнут и скругление углов будет непосредственно у картинки. Выбор за вами!!!


1 комментарий:

  1. Анонимный17 апреля, 2019 12:12

    Не получается в Джумла. Рамка закругляется а сама картинка не закругляется и выходит углами из закругленной рамки. Такое только в джумла почему то. Отдельно делаю в HTML, всё получается нормально.

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