Помощник
|
Как создать блок со скругленными углами, готовые решения и не только |
sc2r2bey
|
Сообщение
#1
|
||
|
|
||
|
|||
SeoMaster_mw |
10.8.2009, 0:58;
Ответить: SeoMaster_mw
Сообщение
#2
|
|
sc2r2bey, а я и не знал, что с помощью CSS можно делать округление углов. Теперь код будет чище
|
|
|
fatery |
10.8.2009, 2:40;
Ответить: fatery
Сообщение
#3
|
|
Предлагаю подборку статей о том как создать блок со скругленными углами: Каждый верстальщик должен это знать) Теперь код будет чище Врятли) Вот вес страницы будет меньше - это да. -------------------- |
|
|
facetus |
2.2.2010, 5:24;
Ответить: facetus
Сообщение
#4
|
|
Спасибочки! Уже переделал под себя, буду юзать...
Кстати, у Вас не задано .block-round...с помощью него я сделал размеры блока с углами... Я немного модернезировал с целью использования уголков для блоков меню, если кому-то надо и кто-то разбереться: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <title>Скругленные уголки для блоков меню</title> <style type="text/css"> .block-menu {width:200px;} /* Старший родитель, для всего содержимого */ .r{position:absolute;margin-left:14px;} /* Родитель для заголовка блока */ .r1,.r2,.r3,.r4,.r5{height:1px;background:silver;} .r1{margin: 0 5px;} .r2{margin: 0 3px;} .r3{margin: 0 2px;} .r4{margin: 0 1px;height:2px;} .r5 {margin: 0 0;height:16px;} /* Здесь можно поиграться с height */ </style> </head> <body> <div class="block-menu"> <div class="r">Разделы proxymania</div> <div class="r1"> </div> <div class="r2"> </div> <div class="r3"> </div> <div class="r4"> </div> <div class="r5"> </div> <ul> <li><a href="#">Ссылка номер раз</a></li> <li><a href="#">Ссылка номер два</a></li> <li><a href="#">Ссылка номер три</a></li> </ul> </div> </body> </html> |
|
|
sc2r2bey
|
Сообщение
#5
|
|
вот нашел интересное кроссбраузерное решение http://www.curvycorners.net/
-------------------- программирую web и для we |
|
|
ZiTosS |
11.3.2010, 21:32;
Ответить: ZiTosS
Сообщение
#6
|
|
sc2r2bey,
If you're viewing this page in Firefox, Safari or Google Chrome you will notice that all the boxes on this page have lovely rounded corners. The rounded corners on this page are rendered by the browser using the browser's native CSS3 border-radius implementation. If you're viewing this page in Internet Explorer or Opera you will see that all the boxes have square corners. This is because IE and Opera don't support CSS3 border-radius. IE and Opera viewers click the button below and CurvyCorners will run, filling the gap in browser support. Говоришь кроссбраузерный? Кроссбраузерность за счет скрипта Или я не прав? |
|
|
sc2r2bey
|
Сообщение
#7
|
|
да за счет скрипта
-------------------- программирую web и для we |
|
|
andreykashops_hb |
14.5.2013, 9:55;
Ответить: andreykashops_hb
Сообщение
#8
|
|
А не проще просто прописать свойство
-moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; ? |
|
|
isvetlichniy |
14.5.2013, 12:24;
Ответить: isvetlichniy
Сообщение
#9
|
|
А не проще просто прописать свойство сегодня конечно проще мил человек, посмотри на дату создания темы |
|
|
narolskay_mw |
14.5.2013, 16:19;
Ответить: narolskay_mw
Сообщение
#10
|
|
Интересно, а в вордпресс, можно в файле css переделать закругленные углы у сайта?
|
|
|
|
Похожие темы
Тема | Ответов | Автор | Просмотров | Последний ответ | |
---|---|---|---|---|---|
Как в пушсетках покупают по 100-200 тысяч кликов за день? | 2 | Boymaster | 676 | Вчера, 17:52 автор: Boymaster |
|
Как вы отдыхаете от работы за компом | 151 | adw-kupon.ru | 19851 | 23.4.2024, 13:52 автор: Vmir |
|
Как вы бросили работу и перешли на заработок с сайтов? | 20 | uahomka | 3461 | 23.4.2024, 11:54 автор: Skyworker |
|
Создать видеоканал лучше в ютуб или телеграм? | 20 | uahomka | 3566 | 20.4.2024, 20:56 автор: Vmir |
|
Как вывести деньги в Украине с заблокированного Юмани ? | 30 | freeax | 5031 | 20.4.2024, 16:49 автор: Liudmila |
Текстовая версия | Сейчас: 25.4.2024, 3:37 |