CSS 4.2.4参考手册
目录搜索
提交中...

©
本文档使用 php.cn手册 发布

文字
分享

语法：

nav-left：auto | <id> [ current | root | <target-name> ]?

默认值：auto

适用于：所有 enabled 的元素

继承性：无

动画性：否

计算值：指定值

相关属性: <' nav-index '> || <' nav-up '> || <' nav-right '> || <' nav-down '>

取值：

  • auto：默认顺序。

  • <id>：被导航元素的id。

  • <target-name>：框架目标页面之间的元素焦点导航。

说明：

设置或检索对象的导航方向。

  • 只有支持nav-index属性的元素才能参与导航排序。

  • 被禁用的元素将不参与导航排序。

  • 该属性有被w3c标准移除的风险。

  • 对应的脚本特性为navLeft。

兼容性：

ValuesIEFirefoxChromeSafariOperaiOS SafariAndroid BrowserAndroid Chrome
Basic Support6.0-11.02.0-40.04.0-45.06.0-8.015.0-29.06.0-8.32.1-4.4.418.0-42.0

示例：

实例

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

32

33

34

35

36

37

38

39

40

41

42

43

44

45

<!DOCTYPE html>

<html lang="zh-cmn-Hans">

<head>

<meta charset="utf-8" />

<title>nav-index_CSS参考手册_web前端开发参考手册系列</title>

<meta name="author" content="Joy Du(飘零雾雨), dooyoe@gmail.com, www.doyoe.com" />

<style>

html,body{margin:0;}

button{position:absolute;}

button#b1{

    top:0;left:50%;

    nav-index:1;

    nav-right:#b2;nav-left:#b4;

    nav-down:#b2;nav-up:#b4;

}

button#b2{

    top:50%;right:0;

    nav-index:2;

    nav-right:#b3;nav-left:#b1;

    nav-down:#b3;nav-up:#b1;

}

button#b3{

    left:50%;bottom:0;

    nav-index:3;

    nav-right:#b4;nav-left:#b2;

    nav-down:#b4;nav-up:#b2;

}

button#b4{

    top:50%;left:0;

    nav-index:4;

    nav-right:#b1;nav-left:#b3;

    nav-down:#b1;nav-up:#b3;

}

</style>

</head>

<body>

<div class="test">

    <button id="b1">button1</button>

    <button id="b2">button2</button>

    <button id="b3">button3</button>

    <button id="b4">button4</button>

</div>

</body>

</html>

            


运行实例 »

点击 "运行实例" 按钮查看在线实例

上一篇：nav-down下一篇：cursor