CSS3 Border
CSS3 Border
С помощью CSS3, вы можете создать закругленные углы, добавить тень в поле, а как образ границы без использования программ дизайна, такие как Photoshop.
В этой главе вы узнаете следующие пограничные свойства:
- граница радиуса
- коробка-тень
- границы изображения
CSS3 закругленные углы
Добавить филе каверзные в CSS2. Мы должны были использовать различные изображения на каждом углу.
В CSS3, очень легко создавать закругленные углы.
В CSS3 граница радиуса свойство используется для создания закругленных углов:
примеров
Добавьте скругления в сНу элемента:
{
border:2px solid;
border-radius:25px;
}
Попробуйте »
CSS3 коробка тени
CSS3 коробчатого теневое свойство используется для добавления тени:
примеров
Добавить окно-тень недвижимость в DIV
{
box-shadow: 10px 10px 5px #888888;
}
Попробуйте »
CSS3 границы картинки
С помощью свойства CSS3 границы изображения, вы можете использовать изображение, чтобы создать границу:
Используйте фотографии, чтобы создать Div границу:
примеров
Используйте фотографии, чтобы создать границы DIV
{
border-image:url(border.png) 30 30 round;
-webkit-border-image:url(border.png) 30 30 round; /* Safari 5 and older */
-o-border-image:url(border.png) 30 30 round; /* Opera */
}
Попробуйте »
Новые свойства Пограничные
свойство | объяснение | CSS |
---|---|---|
границы изображения | Настройка свойств границы сокращенную всех изображений. | 3 |
граница радиуса | Один для установки всех четырех границ - * - радиус сокращённое свойство | 3 |
коробка-тень | Прикрепите один или несколько теней выпадающий список | 3 |