nav-up属性如何使用


本文摘自PHP中文网,作者青灯夜游,侵删。

nav-up属性设置或检索对象的导航方向,有四个属性值可以设置:auto(浏览器决定导航到哪个元素), id(规定被导航元素的id,target-name (规定被导航的目标框架),inherit(规定应从父元素继承 nav-up 属性的值) 。

css nav-up属性如何使用

作用:nav-up 属性规定当使用 nav-up 导航键时,向何处进行导航。

语法:

1

nav-up: auto|id|target-name|inherit;

说明:

auto: 浏览器决定导航到哪个元素。

id :规定被导航元素的 id。

target-name:规定被导航的目标框架。

inherit:规定应从父元素继承 nav-up 属性的值。

注:目前只有 Opera 支持 nav-up 属性。

css nav-up属性使用示例

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

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

<!DOCTYPE html>

<html>

 

    <head>

        <style>

            button {

                position: absolute;

            }

             

            button#b1 {

                top: 20%;

                left: 25%;

                nav-index: 1;

                nav-right: #b2;

                nav-left: #b4;

                nav-down: #b2;

                nav-up: #b4;

            }

             

            button#b2 {

                top: 40%;

                left: 50%;

                nav-index: 2;

                nav-right: #b3;

                nav-left: #b1;

                nav-down: #b3;

                nav-up: #b1;

            }

             

            button#b3 {

                top: 70%;

                left: 25%;

                nav-index: 3;

                nav-right: #b4;

                nav-left: #b2;

                nav-down: #b4;

                nav-up: #b2;

            }

             

            button#b4 {

                top: 40%;

                left: 0%;

                nav-index: 4;

                nav-right: #b1;

                nav-left: #b3;

                nav-down: #b1;

                nav-up: #b3;

            }

        </style>

    </head>

 

    <body>

        <button id="b1">Button 1</button>

        <button id="b2">Button 2</button>

        <button id="b3">Button 3</button>

        <button id="b4">Button 4</button>

        <p><b>注释:</b>目前只有 Opera 支持 nav-* 属性。当您使用方向键导航时,请同时按下 Shift 键。</p>

    </body>

 

</html>

效果图:

1.jpg

以上就是本篇文章的全部内容,希望能对大家的学习有所帮助。更多精彩内容大家可以关注php中文网相关教程栏目!!!

以上就是nav-up属性如何使用的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

css如何消除锯齿

css怎么设置超链接字体加粗效果

css animation-duration属性怎么用

什么是css伪类

使用html+css制作一些动画提示工具

css如何设置页面背景色

css怎么移动文字

css如何设置内边距

css怎么加阴影

css文字如何隐藏

更多相关阅读请进入《nav-up属性》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...