LINUX.ORG.RU

[срочно нид хелп] как лучше всего делать закругленные div'ы ?


0

1

какой наиболее расово верный способ?

через стили или через картинки? нужно чтоб работало в ишаках 6-8, фф, операх последних, хроме.

ps я в этом нуб. разбираться с любым способом Долго. будет обидно, если выберу не оптимальный.

-moz-border-radius: 10px; /* Firefox */ -webkit-border-radius: 10px; /* Safari, Chrome */ -khtml-border-radius: 10px; /* KHTML */ border-radius: 10px; /* CSS3 */ behavior: url(border-radius.htc); /* IE border-radius */

это нормально? или старые браузеры не потянут?



Последнее исправление: dk- (всего исправлений: 2)

так можно?

/* Для браузеров */
-moz-border-radius: 10px; /* Firefox */
-webkit-border-radius: 10px; /* Safari, Chrome */
-khtml-border-radius: 10px; /* KHTML */
border-radius: 10px; /* CSS3 */
/* Для IE */
behavior: url(border-radius.htc); /* IE border-radius */

dk-
() автор топика

Очень просто

[code]border-radius[/code]

Opera 11.00: ok
G-Crome 7.0: ok

Ну и из приведенных вами напишите для IE и FF.

moscwich
()
Ответ на: так можно? от dk-

а почему нет? Только как выше сказал: -khtml-border-radius и -webkit-border-radius — не надо.

moscwich
()
Ответ на: комментарий от anonymous

Значит твоя опера под линь УГ, чувак. Факты и ничего более...

ostin ★★★★★
()
Ответ на: комментарий от avol

> css3pie.com

хорошая маза.

там есть только тонкости, скругленные элементы не должны быть position: static. то есть к обычно расположенным элементам скругление не подойдет. в большинстве случаев достаточно ставить position: relative где это нужно, а если не возможно, либо верстать «в ручную» либо не использовать скругление в ie.

rainy
()

Если верстка фиксированная - то через картинки)
По объему трафика выгода от CSS небольшая, зато в случае с картинками дизайнеры могут воплощать любые свои самые извращенные желания.
Например, просто скругление ты CSSом сделаешь просто, а вот скругление с падающей от дива/контрола тенью (да не пошлой, а естественной) - запаришься и напишешь три мегабайта нечитаемого CSS =)

stevejobs ★★★★☆
()

еще животрепещущий вопрос:

всем пасиба.

теперь новый вопрос:

а как закруглить только 2 угла из 4 ? :)
расположенных на одной диагонали.
верстка - фиксированная по всем размерам.

очен нада :)

это нужно для вывода картинок в диве, левый нижний и правый верхний угол к-го должны быть закруглены.

dk-
() автор топика

Можно заюзать jquery-ui. С ним легко сверстать вполне симпатичный интерфейс в едином стиле и с возможностью использования тем

Deleted
()
Ответ на: комментарий от Deleted

боюсь будет проще писать скрипт к фотошопу к-й все фото (во время подготовки к загрузке) порежет по углам(

dk-
() автор топика
Ответ на: комментарий от rainy

что-то пока не распарсиваю (

dk-
() автор топика
Ответ на: еще животрепещущий вопрос: от dk-

> а как закруглить только 2 угла из 4 ? :)

расположенных на одной диагонали.

верстка - фиксированная по всем размерам.


Ну для css-варианта я дал ссылку: border-radius.com. Там всё очень наглядно — задай нужный радиус у нужных углов, и будет сгенирёт код для трёх актуальных вариантов.

avol
()
Ответ на: комментарий от rainy

Это, по-моему, не самая большая проблема. Бо́льшая проблема в том, что элемент не должен масштабироваться, так как нарисованное для IE скругление не смаштабится вместе с ним.

avol
()
Ответ на: комментарий от wyldrodney

табличка совместимости доставляет )

dk-
() автор топика
Ответ на: комментарий от avol

пасиба за повтор. я, честно говоря, проглядел эту ссылку.
всеж за пределами толкосов надо ходить по всем ссылкам.

dk-
() автор топика
Ответ на: так можно? от dk-

>-moz-border-radius: 10px; /* Firefox */

-webkit-border-radius: 10px; /* Safari, Chrome */

-khtml-border-radius: 10px; /* KHTML */



-o-border-radius 10px; /* Opera */

А то дискриминация :)

KRoN73 ★★★★★
()
Ответ на: комментарий от stevejobs

А пошлая тень это какая, позвольте поинтересоваться? :}

Deleted
()
Ответ на: комментарий от KRoN73

Мне тоже встречалось, как ни странно. А оно вот так :)

Deleted
()
Ответ на: комментарий от KRoN73

ну это понятно я обычно пишу или "." или "./"

enep ★★★★★
()
Вы не можете добавлять комментарии в эту тему. Тема перемещена в архив.