CSS order Свойство
Пример
Задайте порядок следования гибких элементов:
/* Code for Safari 6.1 to 8.0 */
div#myRedDIV {-webkit-order: 2;}
div#myBlueDIV {-webkit-order: 4;}
div#myGreenDIV {-webkit-order: 3;}
div#myPinkDIV {-webkit-order: 1;}
/* Standard syntax */
div#myRedDIV {order: 2;}
div#myBlueDIV {order: 4;}
div#myGreenDIV {order: 3;}
div#myPinkDIV {order: 1;}
Определение и использование
Свойство order указывает порядок гибкого элемента относительно остальных гибких элементов внутри того же контейнера.
Примечание: Если элемент не является гибким элементом, свойство
order не имеет эффекта.
| Значение по умолчанию: | 0 |
|---|---|
| Inherited: | no |
| Animatable: | yes, see individual properties. Читайте о animatable |
| Version: | CSS3 |
| Синтаксис JavaScript: | object.style.order="2" |
Поддержка браузера
Номера в таблице указывают первую версию браузера, которая полностью поддерживает свойство.
Номера followed by -webkit- or -moz- Укажат первую версию, которая работала с префиксом.
| Свойство | |||||
|---|---|---|---|---|---|
| order | 29.0 21.0 -webkit- |
11.0 | 28.0 18.0 -moz- |
9.0 6.1 -webkit- |
17.0 |
Синтаксис CSS
order: number|initial|inherit;
Значения свойств
| Значение | Описание |
|---|---|
| number | Значение по умолчанию 0. Задает порядок для гибкого элемента |
| initial | Присваивает этому свойству значение по умолчанию. (Читайте о initial) |
| inherit | Наследует это свойство из родительского элемента. (Читайте о inherit) |
Похожие страницы
CSS Справка: flex Свойство
CSS Справка: flex-basis Свойство
CSS Справка: flex-direction Свойство
CSS Справка: flex-flow Свойство
CSS Справка: flex-grow Свойство
CSS Справка: flex-shrink Свойство
CSS Справка: flex-wrap Свойство
CSS Справка: align-content Свойство
CSS Справка: align-items Свойство
CSS Справка: align-self Свойство
HTML DOM Справочник: order Свойство