css3 box-orient 屬性
水平排列 div 元素的子元素:
div
{
width:350px;
height:100px;
border:1px solid black;
/* Firefox */
display:-moz-box;
-moz-box-orient:horizontal;
/* Safari、Opera 以及 Chrome */
display:-webkit-box;
-webkit-box-orient:horizontal;
/* W3C */
display:box;
box-orient:horizontal;
}
瀏覽器支援
目前沒有瀏覽器支援 box-orient 屬性。
Firefox 支援替代的 -moz-box-orient 屬性。
Safari、Opera 以及 Chrome 支援替代的 -webkit-box-orient 屬性。
定義和用法
box-orient 屬性規定框的子元素應該被水平或垂直排列。
提示:水平框中的子元素從左向右進行顯示,而垂直框的子元素從上向下進行顯示。不過,box-direction 和 box-ordinal-group 能夠改變這種順序。
預設值: | inline-axis |
---|---|
繼承性: | no |
版本: | CSS3 |
JavaScript 語法: | object.style.boxOrient="vertical" |
語法
box-orient: horizontal|vertical|inline-axis|block-axis|inherit;
值 | 描述 | 測試 |
---|---|---|
horizontal | 在水平行中從左向右排列子元素。 | 測試 |
vertical | 從上向下垂直排列子元素。 | 測試 |
inline-axis | 沿著行內軸來排列子元素(對映為 horizontal)。 | 測試 |
block-axis | 沿著塊軸來排列子元素(對映為 vertical)。 | 測試 |
inherit | 應該從父元素繼承 box-orient 屬性的值。 |
段落 1。
段落 2。
段落 3。
註釋:IE 不支援 box-orient 屬性。
相關文章
- css3屬性CSSS3
- CSS3常用屬性CSSS3
- css3核心屬性CSSS3
- CSS3 filter屬性CSSS3Filter
- CSS3 transition 屬性CSSS3
- CSS3 transform 屬性CSSS3ORM
- CSS3 initial 屬性CSSS3
- CSS3的background屬性CSSS3
- css3的新屬性CSSS3
- CSS3的動畫屬性CSSS3動畫
- css3新增屬性APICSSS3API
- css3新增哪些背景屬性CSSS3
- css3中的animation屬性CSSS3
- CSS3 background-size 屬性CSSS3
- css3中transition屬性詳解CSSS3
- Css3文字新屬性CSSS3
- html5/css3新增屬性HTMLCSSS3
- CSS3背景裁切屬性——background-clipCSSS3
- CSS3的content屬性詳解CSSS3
- css3中的zoom屬性以及jquery中css()方法操作元素的屬性CSSS3OOMjQuery
- CSS3 超實用屬性:pointer-eventsCSSS3
- css3 filter屬性作用演示程式碼例項CSSS3Filter
- 純CSS3屬性animation實現的打字效果CSSS3
- css3 選擇器:屬性選擇器(五)CSSS3
- CSS3屬性選擇器簡單介紹CSSS3
- css3 filter屬性,不會ps也沒關係CSSS3Filter
- CSS3的新屬性的一下總結CSSS3
- 淺談CSS3中display屬性的Flex佈局CSSS3Flex
- HTML5中CSS3的屬性選擇器HTMLCSSS3
- css3瀏覽器私有屬性字首使用詳解CSSS3瀏覽器
- css3的一些新屬性及部分用法CSSS3
- 淺談CSS3中display屬性的Flex佈局(轉)CSSS3Flex
- CSS3 變形、過渡、動畫、關聯屬性淺析CSSS3動畫
- CMake 屬性之全域性屬性
- CSS outline-style 屬性: CSS3 outline-CSSS3
- CSS3屬性-webkit-font-smoothing字型抗鋸齒渲染CSSS3WebKit
- 關於CSS3的變形、過渡、動畫、關聯屬性CSSS3動畫
- iOS動畫 屬性屬性解析iOS動畫