список сокращенных свойств css

Функция JavaScript, которую я создал, должна анализировать все значения CSS, которые не обязательно имеют «одно» значение, прикрепленное к ним. Например, margin:0 0 4px 12px; на самом деле представляет собой четыре значения (margin-top, margin-right и т. д.).

По сути, все, что мне нужно, это список сокращенных свойств. Однако мне не нужны все сокращенные css. Мне просто нужен сокращенный css, который потенциально может быть анимирован (rgb, px, em и т. д.). Итак, меня не волнует border:1px solid black;, так как я не могу анимировать solid., но меня волнует border-width,, поскольку ширина границы — это сокращение для всех четырех границ.

В любом случае, мой список включает:
- ширину границы
- позицию фона
- отступы
- поля
- радиус границы - тень блока
- радиус контура
- цвет границы
- цвет границы - тень текста - шрифт

Так я что-то пропустил? Видите ли, я не знаю, есть ли какие-то неясные свойства, такие как: mystery-color:red green blue hazel pigbreath;


person Community    schedule 11.08.2010    source источник
comment
Вы когда-нибудь получали их список?   -  person mP.    schedule 27.06.2012
comment
В списке анимируемых свойств W3C было большинство, если не все из них (я думаю). Это связано с комментариями к ответу.   -  person Azmisov    schedule 28.06.2012


Ответы (1)


Это полный список всех сокращенных свойств, реализованных в Firefox, взятых из исходного кода. Я не знаю, какие из них «потенциально могут быть анимированы» вашим JavaScript. Я вырезал те, которые являются стенографией по внутренним причинам, слишком сложным для того, чтобы в них вдаваться.

background
border
border-color
border-style
border-width
border-top
border-right
border-bottom
border-left
cue
font
list-style
margin
marker
-moz-border-start
-moz-border-end
-moz-border-radius
-moz-column-rule
-moz-outline-radius
-moz-transition
outline
overflow
padding
pause
person zwol    schedule 11.08.2010
comment
Я предполагаю, что сказать «сокращенные свойства» было не совсем правильно. Просто свойства, в которые встроено несколько значений. Например, background-position или box-shadow. Оба они не являются стенографическими, но имеют несколько значений. - person Azmisov; 11.08.2010
comment
Я не могу легко извлечь это из исходного кода :-/ Может быть, этот список поможет больше? w3.org/TR/css3-transitions/#animatable-properties-< /а> - person zwol; 11.08.2010