Я использую теги div для определения областей на своих веб-страницах. Я установил все очевидные вещи, такие как фон, размер, отступы и т. д. Но все это очень квадратно.
Как я могу использовать только CSS для закругления углов?
Решение проблемы
Вот простой HTML-документ, демонстрирующий, как добиться этого с помощью только CSS.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<style>
.b1f,.b2f,.b3f,.b4f{font-size:1px; overflow:hidden; display:block;}
.b1f {height:1px; background:#ddd; margin:0 5px;}
.b2f {height:1px; background:#ddd; margin:0 3px;}
.b3f {height:1px; background:#ddd; margin:0 2px;}
.b4f {height:2px; background:#ddd; margin:0 1px;}
.contentf {background: #ddd;}
.contentf div {margin-left: 5px;}
</style>
</head>
<body>
<b class="b1f"></b><b class="b2f"></b><b class="b3f"></b><b class="b4f"></b>
<div class="contentf">
Content Area Content Area Content Area Content Area Content Area Content Area
Content Area Content Area Content Area Content Area Content Area Content Area
Content Area Content Area Content Area Content Area Content Area Content Area
</div>
<b class="b4f"></b><b class="b3f"></b><b class="b2f"></b><b class="b1f"></b>
</body>
</html>
Ссылка на оригинал: http://blog.yosle.com/2007/09/20/css-round-corners/
Комментариев нет:
Отправить комментарий