Home >Web Front-end >CSS Tutorial >How to use css3 nav-right attribute?

How to use css3 nav-right attribute?

青灯夜游Original: 2019-02-21 11:58:143464browse

css3 The nav-right attribute is a CSS3 attribute used to specify where to navigate when using the arrow-right navigation key. Its syntax is "nav-right: auto|id|target-name ;", the parameter "auto" indicates which element the browser decides to navigate to.

The nav-right property is a CSS3 property that specifies where to navigate when using the right-arrow navigation key.

Recommended: "css3 Video Tutorial"

CSS3 nav-right attribute

Function:nav-right attribute specifies where to navigate when using the nav-right navigation key.

Basic syntax:

nav-right: auto|id|target-name;

auto: The browser decides which element to navigate to.

id: Specify the ID of the element to navigate to

target-name: Specify the navigation to the target frame

Note: Currently only Opera supports nav- right attribute.

Examples of using the CSS3 nav-right attribute

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<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">按钮1</button>
<button id="b2">按钮2</button>
<button id="b3">按钮3</button>
<button id="b4">按钮4</button>
<p><b>注释：</b>目前只有 Opera 支持 nav-* 属性。当您使用方向键导航时，请同时按下 Shift 键。</p>
</body>
</html>

The above is the entire content of this article, I hope it can be helpful to everyone’s learning help.

The above is the detailed content of How to use css3 nav-right attribute?. For more information, please follow other related articles on the PHP Chinese website!

css3 auto

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：How to use pop() methodNext article：How to use pop() method

See more

How to use css3 nav-right attribute?

Related articles