Я хочу применить 3px вверху слева & верхний правый радиус.CSS браузер безопасный способ применения границы радиуса?
Как это сделать во всех браузерах (например, IE, WebKit, Mozilla)?
И если браузер не поддерживает атрибут border-radius, просто по умолчанию не будет никакого радиуса (квадратный угол).
border-radius.com отлично подходит для этого:
-webkit-border-top-left-radius: 3px;
-webkit-border-top-right-radius: 3px;
-moz-border-radius-topleft: 3px;
-moz-border-radius-topright: 3px;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
Если IE когда-либо поддерживает любые стандарты, плохо питайтесь моей шляпой.
Это лучшее, что вы можете рассчитывать на:
-webkit-border-top-left-radius: 3px;
-webkit-border-top-right-radius: 3px;
-moz-border-radius-topleft: 3px;
-moz-border-radius-topright: 3px;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
Edit: мой плохой, пропустил «верхний левый и правый только» часть, исправил codez
IE является первым в своем списке, но единственный, на который не распространяется ваш пример: P Проверьте ссылку, которую я опубликовал – meo
Правда, но OP также сказал: «И если браузер не поддерживает пограничный радиус атрибут, просто по умолчанию без радиуса ", что и произойдет. Поэтому ответ правильный. –
Чтобы разработать, @sarah, это именно то, что вы хотите. IE не поддерживает округленные углы, поэтому он просто показывает квадратные. WebKit (Safari) и Moz (Firefox и др.) Поддерживают округленные углы, используя CSS-браузер (правила с префиксом). Простой «border-radius» используется для будущей проверки. –
проверки эту тему. она должна охватывать все ваши потребности в скругленными углами: Emulating CSS3 border-radius and box-shadow in IE7/8
border-top-left-radius:3px;
border-top-right-radius:3px;
-webkit-border-top-right-radius:3px;
-webkit-border-top-left-radius:3px;
-moz-border-radius-topright:3px;
-moz-border-radius-topleft:3px;
Это будет работать в Mozilla и Webkit браузеров и что-нибудь с поддержкой CSS3 границы радиуса собственности. IE = нет. Кроме того, вы должны отметить, что FF2 будет поддерживать это, но закругленный край не очень красив.
Что относительно MSIE? – sarah
проверить ссылку, которую я опубликовал для msie. – meo
ссылка meo хорошая. Перейти на эту страницу: http://www.smashingmagazine.com/2010/04/28/css3-solutions-for-internet-explorer/. Для MSIE нет простого решения CSS. :-( – artlung