Лучшее руководство по CSS3 переход недвижимость в 2024 году. В этом руководстве вы можете изучить примеров,Поддержка браузеров,Определение атрибута и инструкции,грамматика,
CSS3 переход недвижимость
примеров
Наведите указатель мыши над сНу элемента, и постепенно изменять ширину таблицы от 100px до 300px ::
{
ширина: 100px;
переход: ширина 2s;
-webkit-переход: ширина 2s; / * Safari * /
}
ДИВ: Hover {ширина: 300px;}
Попробуйте »
Поддержка браузеров
Цифры в таблице представляют первый браузер для поддержки номер версии имущества.
Сразу же после цифровой -webkit-, -ms- или -moz- назад в поддержку префикса атрибута первый номер версии браузера.
属性 | |||||
---|---|---|---|---|---|
transition | 26.0 4.0 -webkit- |
10.0 | 16.0 4.0 -moz- |
6.1 3.1 -webkit- |
12.1 10.5 -o- |
Определение атрибута и инструкции
Переход свойство является сокращенным свойством имеет четыре атрибута: переход-собственности, переходных продолжительность, переходных сроков-функции, и переходных задержки.
Примечание: Всегда указывайте переходных продолжительность свойства, в противном случае длительность 0, переход не будет иметь никакого эффекта.
По умолчанию: | все 0 легкость 0 |
---|---|
Наследование: | нет |
Версия: | CSS3 |
Синтаксис JavaScript: | объект .style.transition = "ширина 2s" |
грамматика
值 | 描述 |
---|---|
transition-property | 指定CSS属性的name,transition效果 |
transition-duration | transition效果需要指定多少秒或毫秒才能完成 |
transition-timing-function | 指定transition效果的转速曲线 |
transition-delay | 定义transition效果开始的时候 |