DEMETR Создание сайтов в Казани

Опубликовано

Приемы CSS 3

Приемы CSS 3С недавних пор при просмотре статистики своих сайтов стал замечать любопытную вещь — пользователей с браузером Internet Explorer 6 = 0. Довольно любопытно. В связи с этим стал частенько применять приемы из CSS3.

Вот несколько свойств, которые я чаще всего использую:

  • text-shadow (создаем тень у текста)
  • box-shadow (создаем тень у блочных элементов)
  • border-radius (закругляем углы у блочных элементов)

Text-shadow

div.shadow{
text-shadow:1px 1px 1px #CCC;
background:#fff; color:#000; padding:5px;
}

Box-shadow

div.boxshadow{
-webkit-box-shadow: 0px 0px 15px #222;
-moz-box-shadow: 0px 0px 15px #222;
box-shadow: 0px 0px 15px #222;
}

Border-radius

div.borderradius{
-webkit-border-radius: 5px 0 5px 0;
-moz-border-radius: 5px 0 5px 0; /* отсчет углов начинается с левого верхнего и далее по часовой стрелке*/
border-radius: 5px 0 5px 0;
border:1px solid #666;
padding:5px;
}

Демонстрацию можно посмотреть здесь.

Приемы CSS 3: Один комментарий

  • Szen — 26.10.2011 в 23:41 #

    Забыли еще одно свойство для задания радиуса углов:
    -khtml-border-radius
    Это для KDE браузеров. Например, браузер Konqueror.