Консультация № 82382
13.04.2007, 13:26
0.00 руб.
0 3 3
Здравствуйте!
Как можно сделать Прямоугольник с ЗАКРУГЛЁННЫМИ УГЛАМИ для мено с градиентной или другой заливкой с использованием CSS?
На портале уже был и вопрос и ответ на подобную тему, ответ экспертов я сохранил, но потом потерял.
Будьте Любезны, помогите!
Большое Спасибо.

Обсуждение

Неизвестный
13.04.2007, 14:28
общий
это ответ
Здравствуйте, SAI!

В приложении ссылка на способы создания скругленных углов.
Может быть это поможет.
И встречный вопрос! А градиент каким должен быть, в какую сторону перетекание? Пиши в личку, может найдем решение!


Приложение:
http://www.smileycat.com/miaow/archives/000044.php
Неизвестный
13.04.2007, 15:23
общий
это ответ
Здравствуйте, SAI!
Вот ссылки на форумах о закругланных углах и заливки.



Приложение:
закругланные углыhttp://kalsey.com/2003/07/rounded_corners_in_css/http://forum.joom.ru/index.php?topic=2517.msg11790http://xhtml.ru/forum/viewtopic.php?id=361заливкаhttp://www.aspnetmania.com/Forums/ForumMessage/212515.htmlhttp://articles.org.ru/cfaq/index.php?qid=486&catid=32http://www.gotdotnet.ru/Forums/Web/323421.aspx
Неизвестный
15.04.2007, 19:34
общий
это ответ
Здравствуйте, SAI!

То, что Вам нужно - в приложении.

Удачи!

P. S. Код не мой, а уважаемого эксперта Web-Extrime.

Приложение:
<HTML><HEAD><STYLE><!-- .raised { background:transparent; width:40%; }.raised h1, .raised p { margin:0 10px; }.raised h1 { font-size:2em; color:#fff; }.raised p { padding-bottom:0.5em; }.raised .b1, .raised .b2, .raised .b3, .raised .b4, .raised .b1b, .raised .b2b, .raised .b3b, .raised .b4b { display:block; overflow:hidden; font-size:1px; }.raised .b1, .raised .b2, .raised .b3, .raised .b1b, .raised .b2b, .raised .b3b { height:1px; }.raised .b2 { background:#ccc; border-left:1px solid #fff; border-right:1px solid #eee; }.raised .b3 { background:#ccc; border-left:1px solid #fff; border-right:1px solid #ddd; }.raised .b4 { background:#ccc; border-left:1px solid #fff; border-right:1px solid #aaa; }.raised .b4b { background:#ccc; border-left:1px solid #eee; border-right:1px solid #999; }.raised .b3b { background:#ccc; border-left:1px solid #ddd; border-right:1px solid #999; }.raised .b2b { background:#ccc; border-left:1px solid #aaa; border-right:1px solid #999; }.raised .b1 { margin:0 5px; background:#fff; }.raised .b2, .raised .b2b { margin:0 3px; border-width:0 2px; }.raised .b3, .raised .b3b { margin:0 2px; }.raised .b4, .raised .b4b { height:2px; margin:0 1px; }.raised .b1b { margin:0 5px; background:#999; }.raised .boxcontent { display:block; background:#ccc; border-left:1px solid #fff; border-right:1px solid #999; } --></STYLE></HEAD><div class="raised"><b class="b1"></b><b class="b2"></b><b class="b3"></b><b class="b4"></b><div class="boxcontent"><h1>Пример</h1><p>"Изогнутая граница с выпуклым трехмерным эффектом"</p></div><b class="b4b"></b><b class="b3b"></b><b class="b2b"></b><b class="b1b"></b></div> </BODY></HTML>
Форма ответа