Изображение аватарки

Здесь вы узнаете, как оформить изображение аватарки при помощи CSS.

Как сделать изображение аватарки

Шаг 1) Добавляем HTML:

Пример


<img src="//msiter.ru/avatar.png" alt="Avatar" class="avatar">

Шаг 2) Добавляем CSS:

Задаем подходящие ширину и высоту и используем свойство border-radius, чтобы скруглить края. Значение 50% сделает изображение круглым:

Пример


.avatar {
  vertical-align: middle;
  width: 50px;
  height: 50px;
  border-radius: 50%;
}