案例:CSS3 案例     状态:可编辑再运行    进入竖版
 运行结果 
x
<p><b>注释:</b>目前只有 Opera 支持 nav-* 属性。当您使用方向键导航时,请同时按下 Shift 键。</p>
 
1
<!DOCTYPE html>
2
<html>
3
<head>
4
<style>
5
button
6
{
7
position:absolute;
8
}
9
10
button#b1
11
{
12
top:20%;left:25%;
13
nav-index:1;
14
nav-right:#b2; nav-left:#b4;
15
nav-down:#b2; nav-up:#b4;
16
}
17
18
button#b2
19
{
20
top:40%;left:50%;
21
nav-index:2;
22
nav-right:#b3; nav-left:#b1;
23
nav-down:#b3; nav-up:#b1;
24
}
25
26
button#b3
27
{
28
top:70%;left:25%;
29
nav-index:3;
30
nav-right:#b4; nav-left:#b2;
31
nav-down:#b4; nav-up:#b2;
32
}
33
34
button#b4
35
{
36
top:40%;left:0%;
37
nav-index:4;
38
nav-right:#b1; nav-left:#b3;
39
nav-down:#b1; nav-up:#b3;
40
}
41
</style>
42
</head>
43
<body>
44
45
<button id="b1">Button 1</button>
46
<button id="b2">Button 2</button>
47
<button id="b3">Button 3</button>
48
<button id="b4">Button 4</button>