Сразу отмечу, что данный способ НЕ работает в Internet Explorer 8.0 и ниже. IE 9 работает с данной функцией. Чтобы использовать данную фичу необходимо в CSS к соответствующему элементу добавить всего три строчки:
Code
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
Две последних строки нужны для Mozilla Firefox и Safari 4. Цифры - радиус закругления в пикселях.
То есть, если нам необходимо, например, к таблице, которой присвоен класс "tab", добавить закруглённые углы, то выглядеть это будет примерно так:
Code
.tab {
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}
Можно добавить рамку - в таком случае она тоже будет иметь закругление:
Code
.tab {
border: 1px solid #ffffff;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}
Данный способ можно использовать фактически со всеми элементами (DIV, BUTTON, TEXTAREA и пр.)