Люди, кто знает, что за зверь?

Что нового, какие браузеры поддерживают?

Стоит или нет ориентироваться на новый стандарт?

Нашёл тестер на проверку поддержки CSS3

Код

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head><title>CSS3 test</title> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <style type="text/css"> #check { display: none; width: 0; height: 0; } #check[rel^="D"] { display: block; width: 0; height: 0; } </style> <script type="text/javascript" defer="defer"> function checkIt() { var obj = document.getElementById("check"); if (window.getComputedStyle) var stat = window.getComputedStyle(obj,null).getPropertyValue("display"); else if (obj.currentStyle) var stat = obj.currentStyle.display; var css3 = (stat == "block"); if (css3) alert("CSS3 поддерживается."); else alert("CSS3 не поддерживается."); } </script> </head><body> <button onclick="checkIt()">Проверить !</button> <span id="check" rel="Detect"></span> </body></html>

Red Dragon, w3c.org говорит, что он еще не принят

Свойства стилей в Mozilla
Этот список некоторых особых свойств стилей которые поддерживаются Mozilla.

Свойства:
-moz-appearance
Используется, чтобы взять обрамление, стиль фона и размеры из используемых операционной системой. Это заставляет XUL прорисовывать эти элементы так же, как это делает система. В настоящее время это работает только в Windows XP and Mac OS X.

-moz-background-clipMoz1.2
Указывает, как фон, цвет или изображение,должно располагаться в пределах элемента.

border: фон простирается в границах элемента. Будет продолжен за границей.
padding: фон не применяется внутри границ элемента.
-moz-background-inline-policyMoz1.2
Определяет, как отображается фоновое изображение встроенного элемента, когда его содержимое переносится на несколько строк.

bounding-box:
continuous: фоновое изображение переносится относительно каждой строки, как будто текст не имеет никаких ограничений строки. Например, если изображение - 500 пикселов, а встроенное поле - 300 пикселов, первые 300 пикселов изображения появляются на первой строке, а следующие 200 пикселов, вместе со 100 пикселами изображения появляются на второй строке. Изображение повторяется до конца содержимого элемента.
each-box:
-moz-background-originMoz1.2
Определяет, куда помещен верхний левый угол фонового изображения .

content: изображение начинается с внешнего края содержимого, но до отступа.
border: изображение начинается с внешнего края обрамления.
padding: изображение начинается с внешнего края отступа, но внутри обрамления.
-moz-binding
Используется, чтобы определить свяь, для использования элементом. Свойством должен быть URL XBL файла, содержащего связь. URL может содержать якорь, чтобы указать на определенную связь с XBL файлом, упомянутым его id.

-moz-border-colors-bottomMoz0.9.8
Устанавливает цвета обрамления для нижнего края. Должен быть указан список из нескольких цветов. Когда граница элемента превышает 1 пиксел, каждый следующий пиксел обрамления использует следующий цвет из указанных в этом свойстве. Это устраняет потребность во вложенных полях. Если граница более широка чем количество цветов, указанных для этого свойства, то остающаяся часть границы использует цвет, указанный свойством обрамления.

-moz-border-colors-leftMoz0.9.8
Устанавливает цвета обрамления для левого края. См. свойство -moz-border-colors- bottom для получения дополнительной информации.

-moz-border-colors-rightMoz0.9.8
Устанавливает цвета обрамления для правого края. См. свойство -moz-border-colors- bottom для получения дополнительной информации.

-moz-border-colors-topMoz0.9.8
Устанавливает цвета обрамления для верхнего края. См. свойство -moz-border-colors- bottom для получения дополнительной информации.

-moz-border-radius
Это свойство может использоваться, чтобы округлить углы обрамления. Устанавливается числовым значением, указывающим степерь округления. Вы должны обозначить единицы (обычно px для пикселов). Болшее число делает границу более круглой.

-moz-border-radius-bottomleft
Устанавливает округление нижнего левого угла границы.

-moz-border-radius-bottomright
Устанавливает округление нижнего правого угла границы.

-moz-border-radius-topleft
Устанавливает округление верхнего левого угла границы.

-moz-border-radius-topright
Устанавливает округление верхнего правого угла границы.

-moz-box-align
Атрибут align определяет, как выровнены дочерние элементы поля, когда размер поля больше, чем полный размер дочерних элементов. Для полей, имеющих горизонтальную ориентацию, определяется, как ее дочерние элементы будут выровнены по вертикали. Для полей, имеющих вертикальную ориентацию, укаэывается как ее дочерние элементы выравниваются по горизонтали. Атрибут pack используется, чтобы определить позицию в противоположном направлении. Вы также можете определить особые значения выравнивания используя свойства стиля -moz-box-align:

start: Дочерние элементы начинают выравниваться с левого или с верхнего края поля. Если поле большее чем полный размер дочерних элементов, свободное пространство помещяется справа или снизу.
center: Свободное пространство разбито одинаково по каждой стороне дочерних элементов, в результате дочерние элементы помещаются в центр поля.
end: Дочерние элементы выравниваются с правой стороны или с нижнего края поля. Если поле больше чем полный размер дочерних элементов, свободное пространство помещяется слева или сверху.
baseline: Это значение - только для горизонтально ориентируемых полей. Оно заставляет дочерние элементы быть выровненным так, чтобы их текстовые метки были выстроены в линию.
stretch: Дочерние элементы растягиваются, чтобы приспособиться к размеру поля. Для горизонтального поля, дочерние записи растягиваются, чтобы иметь высоту поля. Для вертикального поля, дочерние записи растягиваются, чтобы иметь ширину поля. Если размер поля изменяется, дочерние элементы растягиваются в соответствии с изменением. Используйте атрибут flex, , чтобы создать элементы, которые будут растягиваться в противоположном направлении.
-moz-box-direction
Определяет направление поля, в которое помещены дочерние элементы.

normal: Дочерние элементы располагаются слева направо или сверху вниз, в порядке их появлявления в XUL или дереве документа.
reverse: Дочерние элементы располагаются справа налево или снизу вверх, в порядке их появлявления в XUL или дереве документа.
-moz-box-flex
Указывает гибкость элемента. Гибкие элементы растягиваются и сжимаются, чтобы приспособиться к данному пространству. Если в пределах одного контейнера существует несколько "гибких" элементов, то фактическое значение - не уместно. Элементы с большим значением гибкости растянутся больше, относительно элементов с более низким значением.

-moz-box-flexgroup
Это свойство группирует гибкие элементы вместе и должно быть установлено целым числом. Сначала изменяются элементы с более низким значением. Когда эти элементы достигли своих максимальных размеров, изменяются элементы со следующим по высоте значением. Этот процесс продолжается до тех пор, пока не закончатся элементы. Тот же самый процесс происходит и при уменьшении размера, только в другом направлении.

-moz-box-orient
Это - соответствующее свойство стиля для атрибута ориентации XUL элемента. Для элементов, которые являются полем, это определяет, размещены дочерние элементы горизонтально или вертикально.

horizontal: дочерние элементы в строке помещены горизонтально.
vertical: дочерние элементы помещены в столбце вертикально.
-moz-box-pack
Атрибут pack определяет, как выровнены дочерние элементы поля, когда размер поля больше, чем полный размер дочерних элементов. Для полей, имеющих горизонтальную ориентацию, определяется, как ее дочерние элементы будут выровнены по горизонтали. Для полей, имеющих вертикальную ориентацию, укаэывается как ее дочерние элементы выравниваются по вертикали. Атрибут align используется, чтобы определить позицию в противоположном направлении. Вы также можете определить особые значения выравнивания используя свойства стиля -moz-box-pack:

start: Дочерние элементы начинают выравниваться с левого или с верхнего края поля. Если поле большее чем полный размер дочерних элементов, свободное пространство помещяется справа или снизу.
center: Свободное пространство разбито одинаково по каждой стороне дочерних элементов, в результате дочерние элементы помещаются в центр поля.
end: Дочерние элементы выравниваются с правой стороны или с нижнего края поля. Если поле больше чем полный размер дочерних элементов, свободное пространство помещяется слева или сверху.
-moz-box-sizing
Это свойство определяет, как рассчитана ширина и высота элемента. Это затрагивает свойства высота и ширина.

content-box: свойства ширина и высота определяют размер элемента, включая отступы.
border-box: свойства ширина и высота определяют размер элемента, включая отступы и обрамление.
padding-box: свойства ширина и высота определяют размер элемента. Отступы, обрамление и поля не включаются в этот размер.
-moz-image-regionMoz0.9.8
Для элементов, содержащих изображение, это свойство устанавливает область которая им используется. Синтаксис подобен свойству clip. Все четыре значения - относительно верхнего левого угла изображения. Вы можете использовать одно и то же изображение для нескольких элементов, но использовать его различную области, сокращая тем самым требуемый объем памяти. Вы можете изменять это свойство, чтобы моделировать анимацию.

-moz-key-equivalent
-moz-opacity
Это свойство может использоваться, чтобы сделать элемент частично прозрачным. То, что находится позади элемента будет частично видимо. Значение - десятичное число между 0 и 1, где 0 - полностью невидим(прозрачен), 1 - полностью непрозрачен. Таким образом, значение 0.5 даст полупрозрачность.

-moz-outline
Это свойство может использоваться, чтобы установить контур элемента. Контур - подобен обрамлению, но имеет некоторые в том как он реализуется. Это свойство подобно outline CSS2, которое Mozilla в настоящее время не поддерживает.

-moz-outline-color
Устанавливает цвет контура.

-moz-outline-radius
Это свойство может использоваться, чтобы округлить углы контура. Устанавливается числовым значением, указывающим степерь округления. Вы должны обозначить единицы (обычно px для пикселов). Болшее число делает контур более круглым.

-moz-outline-radius-bottomleft
Округляет нижний левый угол контура.

-moz-outline-radius-bottomright
Округляет нижний правый угол контура.

-moz-outline-radius-topleft
Округляет верхний левый угол контура.

-moz-outline-radius-topright
Округляет верхний правый угол контура.

-moz-outline-style
Устанавливает стиль контура, который может иметь те же самые значения, что и свойство стиля обрамления.

-moz-outline-width
Устанавливает ширину контура.

-moz-user-focus
Указывает, может ли элемент иметь фокус. Устанавливив 'ignore', Вы можете отключить фокус элемента, это означает, что пользователь не сможет активизировать элемент. Элемент будет пропущен в последовательности позиции табуляции. Подобное свойство 'user-focus' было предложено для CSS3.

ignore: элемент не принимает клавиатуру, сосредотачиваются и будет пропущен в заказе(порядке) позиции табуляции.
normal: элемент может принимать центр клавиатуры.
-moz-user-input
Используется, чтобы указать, может ли значение элемента быть изменено. Это главным образом относится к textboxes.

disabled: пользователь не может редактировать значение textbox. Пользователь может только выделить текст в textbox.
enabled: пользователь может редактировать значение textbox.
-moz-user-select
Используется, чтобы указать, может ли текст элемента быть выделен. Это не имеет никакого влияния на содержание загруженного chrome, кроме textbox. Подобное свойство 'user-select' было предложено для CSS3.

none: текст элемента не может быть выделен.
normal: текст может быть выделен пользователем.
display(отображение)
Хотя свойство отображения - часть стандарта CSS, для стилей XUL существуют некоторые дополнительные значения. Вы можете использовать эти значения также и для не-XUL элементов, хотя это может произвести к необычным результатам.

-moz-box: Дочерние элементы размещены горизонтально или вертикально.
-moz-inline-box:
-moz-grid: Дочерние элементы размещены как координатная сетка XUL.
-moz-inline-grid:
-moz-grid-group: Дочерние элементы размещены как группа столбцов или строк координатной сетки. Это - размещение, используется элементами столбец и строка. Вы можете использовать ориентацию (-moz-box-orient), чтобы установить направление. Строки обычно имеют вертикальную ориентацию, и столбцы - горизонтальную .
-moz-grid-line: Дочерние элементы размещены как отдельный столбец или строка сетки. Вы можете использовать ориентацию (-moz-box-orient),чтобы установить направление.
-moz-stack: Дочерние элементы расположены друг на друге подобно элементу stack XUL.
-moz-inline-stack:
-moz-deck: Дочерние элементы расположены друг на друге подобно XUL элементу deck. В отличие от stack, только верхний элемент отображен.
-moz-popup:
-moz-groupbox:
overflow(переполнение)
Mozilla поддерживает некоторые дополнительные значения для свойства переполнения, которых нет в стандарте CSS. Свойство переполнения используется, чтобы определить то, что случается, когда содержание превышает размер контейнера.

-moz-scrollbars-horizontal: Указывает, что должны появиться горизонтальные полосы прокрутки .
-moz-scrollbars-vertical: Указывает, что должны появиться вертикальные полосы прокрутки .
-moz-scrollbars-none: Указывает, что никакие полосы прокрутки появиться не должны .

Это сообщение отредактировал(а) Desdichado - 20.8.2004, 16:03

Для информации: спецификация CSS3 на русском

модуть 1 - 15 kb
модуль 2 - 19 kb
модуль 3 - 29 kb

Это сообщение отредактировал(а) Red Dragon - 7.9.2004, 12:30

Правда есть сомнение, что всеми любимый ie будет нормально поддерживать css3
Кстати, есть информация, что и в Longhorn поддержка xhtml так и не появится
Так что лыжи мылить пока рано
И вообще -- http://www.mozdev.ru/twiki/pub/Mozdev/WebH...mozilla101.html (если кто не читал)