CSS3 - Новый стандарт (К сожалению он доступен не во всех браузерах)

[Zeleboba]

И так начнём, не так давно появилась информация о новых возможностях css и имя ему css3! Сейчас попробую показать некоторые его возможности, правда css3 ещё не вышел официально но некоторые браузеры (Например FireFox) поддерживают некоторые его функции.
Текст:
Тень

.shadow {
color: #0000CC;
background-color: #fff;
text-shadow: 4px 4px 4px #666666;
font-size: 25px;
}

text-shadow
* Первый параметр — смещение по оси X;
* Второй — смещение по оси Y;
* Третий — радиус размытия;
* Четвертый — цвет тени.
Вот так примерно будет выглядеть готовый вариант:

Блоки:

.block_resize {
background-color: #E4EAF2;
-moz-border-radius: 15px;
border: 4px solid #FFFFFF;
padding: 10px;
width: 60px;
}

*-moz-border-radius - радиус закругления угла
Выглядит это в деле примерно так:

PS Тему буду дополнять!

 

[Arm]

Что-то мне кажется, что в этот раз с идеями внедерения новых правил разработчики перестарались… Dave Hyatt, Dean Jackson и Chris Marrin (все трое работают в Apple) предложили внедрить в CSS 3 поддержку создания анимации, трансформацию объектов, их изменение с течением времени и ввести css-переменные.

О причине реализации возможности создания анимации они пишут:

На сегодняшний день создание анимации поддерживается лишь на языке SVG, но нет ни одной системы, котрая бы поддерживала создание анимации с помощью CSS. Поэтому наша цель – решить эту задачу внедрением особых CSS свойств, которые будут иметь значения, отвечающие за создание анимации и управление ею.

нашел в гугле)


Примеры использования:
@variables {
CorporateLogoBGColor: #fe8d12;
}
div.logoContainer {
background-color: var(CorporateLogoBGColor);
}
@variables {
myMargin1: 2em;
}
@variables print {
myMargin1: 2em;
}
.data, div.entry {
margin-left: 30px;
margin-left: var(myMargin1);
}

Смысл этого кода таков: селектор variables определяет имя и значение переменной, которое можно в дальнейшем приписать к любому элементу. Идея все же не проработана. Зачем определять для цвета переменную, если его можно просто указать?

 

[nuvusuki]

Увы не все браузеры поддерживаются, поскольку CSS3 существует как черновик

 

[Dagert]

Увы не все браузеры поддерживаются, поскольку CSS3 существует как черновик

последние версии все. старые не поддерживают

 

[mZer0ne]

Будем ждать масовой модорнизации Браузеров или новой ОС чтоб все было встроено =)
Но мне кажиться что увы нечего лутьше Windows На рынке ближайщее время не появиться =)) а я так-бы хотел MacOS X хотябы, Но увы у меня не Apple =(

 

[kpachbiu]

Если у вас Vista или W7 можете скачать превью IE9 - http://ie.microsoft.com/testdrive/
Там интересно показаны новые возможности, и не только CSS3