Доверьте продвижение нам

Комментарии

Один комментарий на «“Как закруглить края картинки в CSS”»

  1. Обязательно воспользуюсь Вашими рекомендациями. Спасибо.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

от 29 920 

Как закруглить края картинки в CSS

Views Icon3

Для закругления краев картинки в CSS можно использовать свойство border-radius.

HTML:

<img class="my-image" src="my-image.jpg">

CSS:

.my-image {
  border-radius: 50%;
}

Этот код закругляет края изображения в виде круга путем задания радиуса границы в 50%.

HTML:

<img class="my-image" src="my-image.jpg">

CSS:

.my-image {
  border-radius: 10px;
}

Этот код закругляет края изображения в виде прямоугольника с радиусом углов, заданным в 10 пикселей.

Также можно задать радиусы границ отдельно для каждого угла. Например:

HTML:

<img class="my-image" src="my-image.jpg">

CSS:

.my-image {
  border-radius: 10px 20px 30px 40px; /* верхний левый, верхний правый, нижний правый, нижний левый */
}

Этот код создает закругление углов изображения со следующими радиусами: верхний левый — 10 пикселей, верхний правый — 20 пикселей, нижний правый — 30 пикселей, нижний левый — 40 пикселей.

Надеюсь, эта информация была вам полезна!

Поделиться:

Задать вопрос

Оставляя заявку, вы соглашаетесь с политикой обработки персональных данных.

Оставить заявку

Оставляя заявку, вы соглашаетесь с политикой обработки персональных данных.