Авторский знак. Seosait21.ru Есть у человека надежда. Пока не поздно. Вгрызайся и изучай.
Нажимай и поддержи.

Пн Вт Ср Чт Пт Сб Вс
1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31


Чувашия-это моя Россия

Ссылки на каскадные стили CSS - box-orient.

Поддержка Браузеров

Google Chrome Google Chrome Opera Опера Firefox Firefox Safari Сафари.

Firefox поддерживает альтернативу свойства -moz-box-orient. Safari, Opera и Chrome поддерживают альтернативу свойства -webkit-box-orient.

Определение и использование. Свойство box-orient определяет, должно ли быть расположены дочерние элементы горизонтально или вертикально. Внимание!!! Дочерние элементы в пределах горизонтального поля отображаются слева направо, дочерние элементы, находящиеся под вертикальной коробкой отображаются сверху вниз. Тем не менее, свойства box-direction и box-ordinal-group могут изменить этот порядок.

Внимание!!! Чтобы свойство box-orient работало необходимо установить display: box. Иначе, могут возникнуть некоторые проблемы.

Самое мощное здесь даже не в том, что производится некое изменение некого участка страницы сайта. Самое мощное здесь в том, что свойство box-orient, которое действует через стили CSS3 автономно работает даже при отключения JavaScripta в браузере Вашего компьютера.


Синтаксис:

              box-orient: horizontal|vertical|inline-axis|block-axis|inherit;

Определение и Использование

Значение по умолчанию: inline-axis
Inherited: no
Версия: CSS3
JavaScript синтаксис: object.style.boxOrient="vertical"


Свойства Значения

Значение Описание
horizontal Расположить дочерние элементы слева направо по горизонтали
vertical Расположить дочерние элементы сверху вниз по вертикали
inline-axis Расположить дочерние элементы вдоль inline оси( горизонтальная)
block-axis Расположить дочерние элементы вдоль блока оси( вертикальная)
inherit Значение box-orient должны быть унаследованы от родительского элемента


Пишем программу - Выложить дочерние элементы div по горизонтали элемента:

< !DOCTYPE html>
< html>
< head>
< style> 
div#rr
{
width:550px;
height:100px;
border:1px solid black;
  
/* Firefox */
display:-moz-box;
-moz-box-orient:horizontal;

/* Safari, Opera, and Chrome */
display:-webkit-box;
-webkit-box-orient:horizontal;

/* W3C */
display:box;
box-orient:horizontal;
}
< /style>
< /head>
< body>

< div id="rr">
< p>Саша< /p>
< p>Паша< /p>
< p>Наташа< /p>
< /div>

< p>< b>Внимание!!!< /b> Свойство box-orient не поддерживается в IE.< /p>

< /body>
< /html>                      

Результат программы:

Саша

Паша

Наташа

Внимание!!! Свойство box-orient не поддерживается в IE.




seosait21.ru
HTML

seosait21.ru
CSS

seosait21.ru
Web-диз.
HTML ссылка CSS ссылка ...

seosait21.ru
JavaScript

seosait21.ru
PHP

seosait21.ru
JQuery
JavaScript ссылка PHP ссылка JQuery ссылка

seosait21.ru
SEO.

seosait21.ru
MySQL

seosait21.ru
XML
... ... ...

обратно на главную     назад    дальше     вперед

ПОНРАВИЛОСЬ?
ПОДЕЛИСЬ с ДРУЗЬЯМИ: