Как сделать закругленные углы в браузерах без CSS3?

Question

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

Например, если мне нужна сплошная синяя граница 4px с радиусом границы 8px вокруг данного элемента, и я разработал четыре изображениясоответственно,

• top-left-corner.png
• top-right-corner.png
• bottom-left-corner.png
• bottom-right-corner.png

Как мне реализовать это, если это возможно без использования таблицы?

Answer 1

Вы пробовали http://css3pie.com/about/? Вам не нужно использовать изображения в таком случае ...

Answer 2

Я бы не использовал бы обходные пути / хаки css, которые другие предложили здесь, я бы продолжал использовать изображения.Да, его проще настроить, но он кроссбраузерен и надежен.Я перепробовал ряд этих обходных путей CSS и нашел их в лучшем случае непредсказуемыми.Они могут хорошо работать на некоторых установках IE, но не на других (например, полный сбой браузера).И что еще хуже, мы не смогли определить, почему он работал нормально на некоторых установках, а не на других (и это для той же версии IE).

Я бы либо: жил без IE в кривых углах, либо использовал изображения,Вы можете использовать вложенные div:

<div class="top-left">
   <div class="top-right">
       <div class="bottom-left">
          <div class="bottom-right">

             ... content ...
          </div>
       </div> 
    <div>
 </div>

, и в css вы устанавливаете присвоенные background-image для каждого класса, что-то вроде этого:

div.top-left { background: url('/top-left-corner.png') left top no-repeat; }

и устанавливаете стиль границы для одного изтоже div, например:

border: 4px solid #f00;

Answer 3

Если вы разрешите таблицы и некоторый код, вы можете сделать это без изображений и легко переключать цвета:

http://spruce.flint.umich.edu/~jalarie/jaa_kcm.htm

Answer 4

В Google так много ссылок на это, просто наберите закругленные углы css, и вы должны найти что-то, чтобы помочь. Более старые методы включали использование чего-то вроде набора тегов b выше и ниже поля, которое вы хотите округлить, и указание полей для получения нужного вам радиуса, но это немного усложняется, и есть лучшие сглаженные решения.