Искатель :

3акругленные края

30 Янв 2013
Делаем закругленные края у div блока с помощью css
Прежде всего, этот урок будет полезен Web - мастерам которые занимаются вёрской шаблонов. Оформление сайта смотрится лучше, если края блоков слегка закруглены и не имеют острых углов.
Чтобы достич такого эффекта с помощью графических элементов, которые будут оформлять углы, уйдёт не мало времени на их создание, а после всего этого, потребуется написать не мало кода чтобы всё это оформить.
На помощь нам приходит css3 с его новыми свойствами.
Живой пример div блока с закруглёнными углами.
Компактный код, который и создаёт данный эффект.
-=css=-
1 div {
2 webkit-border-radius: 5px;
3 moz-border-radius: 5px;
4 border-radius: 5px 5px 5px 5px;
5 border:1px solid #000000;
6 height:50px;
7 }
-=html=-
1 <div id="div">
2 <!--Содержимое блока-->
3 </div>
В моём случае размер закругления равен 5px, если вы хотите сделать их больше или меньше, измените это значение в каждой строке.