Здесь вы узнаете, как оформить изображение аватарки при помощи CSS.
![Avatar](http://msiter.ru/sites/default/files/msiter_files/img_avatar.png)
![Avatar](http://msiter.ru/sites/default/files/msiter_files/img_avatar2.png)
![Avatar](http://msiter.ru/sites/default/files/msiter_files/img_avatar3.png)
![Avatar](http://msiter.ru/sites/default/files/msiter_files/img_avatar4.png)
![Avatar](http://msiter.ru/sites/default/files/msiter_files/img_avatar5.png)
Как сделать изображение аватарки
Шаг 1) Добавляем HTML:
Пример
<img src="avatar.png" alt="Avatar" class="avatar">
Шаг 2) Добавляем CSS:
Задаем подходящие ширину и высоту и используем свойство border-radius
, чтобы скруглить края. Значение 50% сделает изображение круглым:
Пример
.avatar {
vertical-align: middle;
width: 50px;
height: 50px;
border-radius: 50%;
}
Попробовать самому »