Главная > Дизайн > CSS > Рамки с круглыми краями и прозрачность в CSS.

Рамки с круглыми краями и прозрачность в CSS.

22.02.2010. CSS, Дизайн

2

Круглые края с помощью CSS

Существует множество способов создания рамок с круглыми краями. И в CCS3 наконец-то включили такую возможность. Разумеется, всеми любимый MS Internet Explorer об этом до сих пор не знает, ну и пошел лесом, все равное его у меня нет;)
Создание рамок в CSS3 очень просто. Правда пока приходится писать 3 варианта кода, ну это не страшно.

Вот CSS свойства для создания закругленных рамок:

CSS Gecko (Mozilla...) WebKit (Safari, Konqueror, Arora, Google Chrome и т.д.)
border-radius -moz-border-radius -webkit-border-radius
border-top-right-radius -moz-border-radius-topright -webkit-border-top-right-radius
border-bottom-right-radius -moz-border-radius-bottomright -webkit-border-bottom-right-radius
border-bottom-left-radius -moz-border-radius-bottomleft -webkit-border-bottom-left-radius
border-top-left-radius -moz-border-radius-topleft -webkit-border-top-left-radius

Если у вас нормальный браузер, то таблица выше должна быть в рамке с закругленными углами. Я думаю, объяснять значения свойств не надо, в них и так все написано. Радиус рамки можно задавать в px, em, pt и т.д.

Вот например текст в рамке с радиусом, равным 1em.

Прозрачность с помощью CSS

Еще одно свойство CSS3 - прозрачность. Позволяет делать элемент прозрачными и полупрозрачными. Как уже говорилось, MS Internet Explorer об этом свойстве не знает и его не поддерживает.

Задается свойство очень просто:

opacity: значение от 0 до 1;

1 - полная непрозрачность, 0 - полная прозрачность

Текст с прозрачностью 0.5

А ниже полностью прозрачный текст:

Полностью прозрачный текст

Можете попробовать выделить строчку выше, скопировать ее в блокнот и убедиться в этом;)
P.S.
Хотите сделать сайт, а хостинг еще не выбрали. Этот хостинг для сайтов специально для вас.
P.P.S.
Вот здесь вы сможете узнать все про социальные сети России




Похожие записи:


Метки:

Rambler's Top100 Блогун - монетизируем блоги