кодесурса
«HTML

HTML CSS упражнение: CSS3 изображение округлено

script1adsense2code
script1adsense3code

Решение:

HTML-код:

<!doctype html>
<html>
<head>
<title>HTML CSS Exercise - make an image rounded with CSS3</title>
<style>
.rounded-img {
border-radius: 50%
}
</style>
</head>
<body>
<img data-src="holder.js/140x140" class="rounded-img" alt="140x140" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNDAiIGhlaWdodD0iMTQwIj48cmVjdCB3aWR0aD0iMTQwIiBoZWlnaHQ9IjE0MCIgZmlsbD0iI2VlZSI+PC9yZWN0Pjx0ZXh0IHRleHQtYW5jaG9yPSJtaWRkbGUiIHg9IjcwIiB5PSI3MCIgc3R5bGU9ImZpbGw6I2FhYTtmb250LXdlaWdodDpib2xkO2ZvbnQtc2l6ZToxMnB4O2ZvbnQtZmFtaWx5OkFyaWFsLEhlbHZldGljYSxzYW5zLXNlcmlmO2RvbWluYW50LWJhc2VsaW5lOmNlbnRyYWwiPjE0MHgxNDA8L3RleHQ+PC9zdmc+" style="width: 140px; height: 140px;">
</body>
</html>

Демонстрация в реальном времени:

См. Pen- image- roundounded -answer от w3resource ( @ w3resource ) в CodePen .


Поддерживаемый браузер

«Opera«Интернет
да да да да да

Каков уровень сложности этого упражнения?

Новый контент: Composer: менеджер зависимостей для PHP , R программирования


script1adsense4code
script1adsense5code
disqus2code
script1adsense6code
script1adsense7code
script1adsense8code
buysellads2code