ホームページ  >  記事  >  ウェブフロントエンド  >  nav-up 属性の使用方法

nav-up 属性の使用方法

青灯夜游
青灯夜游オリジナル
2019-01-30 11:46:583632ブラウズ

nav-up 属性は、オブジェクトのナビゲーション方向を設定または取得します。設定できる属性値は、auto (ブラウザーがどの要素に移動するかを決定します)、id (オブジェクトの ID を指定します) です。ナビゲートされる要素、target-name (ナビゲートされる要素を指定)、ターゲット フレームワーク)、inherit (nav-up 属性の値が親要素から継承される必要があることを指定)

nav-up 属性の使用方法

##css nav-up 属性の使用方法 #関数:

nav-up 属性は、nav-up を使用するときに移動する場所を指定します。ナビゲーション キー

構文:

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

auto: ブラウザーがどの要素に移動するかを決定します。 #id: ナビゲートされる要素 # の ID を指定します。

##target-name: ナビゲートされるターゲット フレームを指定します。

inherit: nav-up 属性の値を指定します。

注:

現在、nav-up 属性をサポートしているのは Opera だけです。

css nav-up 属性の使用例。

##
<!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>

レンダリング:

上記はこの記事の全内容です。皆さんの学習に役立つことを願っています。さらにエキサイティングなコンテンツがある場合は、php 中国語 Web サイトの関連チュートリアルに注目してください。

以上がnav-up 属性の使用方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。