案例：CSS3 案例     状态：可编辑再运行    进入竖版
 运行结果　
​x
 
1
<!DOCTYPE html>
2
<html>
3
<head>
4
<style>
5
.box
6
{
7
display:-moz-box;
8
display:-webkit-box;
9
display:box;
10
width:200px;
11
height:100px;
12
border:2px solid red;
13
}
14
</style>
15
<script>
16
function ChangeBoxAlign(x)
17
{
18
// Returns the selected option's text
19
var boxAlign=x.options[x.selectedIndex].text;
20
var div=document.getElementById("myDiv");
21
if (div.style.MozBoxAlign!==undefined)
22
  {
23
  div.style.MozBoxAlign=boxAlign;
24
  }
25
else if (div.style.webkitBoxAlign!==undefined)
26
  {
27
  div.style.webkitBoxAlign=boxAlign;
28
  }
29
else
30
  {
31
  alert("Your browser doesn't support this example!");
32
  }
33
}
34
</script>
35
</head>
36
<body>
37
<div class="box" id="myDiv">
38
  <b>第一个子元素</b>
39
  <i>第二个子元素</i>
40
</div>
41
​
42
<select onchange="ChangeBoxAlign (this);" size="6">
43
  <option selected="selected" />baseline
44
  <option />center
45
  <option />end
46
  <option />inherit
47
  <option />start
48
  <option />stretch