Home

Tags

Закругленные углы и тень в CSS

2010-06-15 css

Пример закругления div
{

Привет
}

Исходный код
<style>
div#sample {
    border-radius: 8px;
    box-shadow: 0 0 5px #999;
    -webkit-border-radius: 8px;
    -webkit-box-shadow: 0 0 5px #999;
    -moz-border-radius: 8px;
    -moz-box-shadow: 0 0 5px #999;

    width: 50px;
    border: 1px solid #CCC;
    padding: 5px; }
</style>
<div id="sample">Привет</div>

Закругление

border-radius: Rpx;
-webkit-border-radius: Rpx;
-moz-border-radius: Rpx;

Задается 1 параметр - радиус закругления.

Тень

box-shadow: Xpx Ypx Rpx Color;
-webkit-box-shadow: Xpx Ypx Rpx Color;
-moz-box-shadow: Xpx Ypx Rpx Color;

Для тени указываются 4 параметра: смещение по оси X, смещение по оси Y, Размер размытости, цвет.