Скругленные углы используя CSS3 (multiple backgrounds и border-radius).

Для экспериментов взял приведенный выше макетик. Тестировал в Safari для Windows так как этот браузер понимает multiple background и border-radius.
HTML разметка.
<div class=”block”>
текст
</div>
Эта разметка используеться для обоих примеров.
Multiple backgrounds для скругления углов.
Изображения, которые используем

градиентный фон блока

верхний правый угол

нижний левый угол

Непосредственно css
.block{
background-color:#4ea5ff;
background-image: url(bg-b-l.gif), url(bg-t-r.gif), url(bg-gr.gif);
background-repeat: no-repeat, no-repeat, repeat-x;
background-position: bottom left, right top, bottom left;
padding:20px;
margin:20px;
color:#ffffff;
}
Нужно заметить, что в […]

Закругленные углы используя CSS

Сейчас чутли не на каждом сайте используются блоки с закруглёнными углами. Я хочу рассмотреть пример создания такого эффекта для блока с заголовком и каким либо текстом.
В данном приёме используется два изображения : round-l.png и round-r.png.
HTML разметка выглядит следующим образом:<div class=”rounded-corners”>
<h3>Заголовок</h3>
<div>
<p>Текст</p>
</div>
</div>
Теперь, самое интересное, начнём работать над CSS. Распишем бекграунды:.rounded-corners{
background:transparent url(ound-l.png) no-repeat left top;
}
.rounded-corners h3{
background:transparent url(round-r.png) no-repeat […]