Heim > Web-Frontend > Front-End-Fragen und Antworten > So verwenden Sie das CSS-Nav-Index-Attribut

So verwenden Sie das CSS-Nav-Index-Attribut

藏色散人
Freigeben: 2019-05-30 15:15:36
Original
3331 Leute haben es durchsucht

css nav-index-Attribut wird verwendet, um die fortlaufende Navigationsreihenfolge („Tab-Reihenfolge“) von Elementen anzugeben. Die Syntax des nav-index-Attributs lautet nav-index: auto|number|inherit.

So verwenden Sie das CSS-Nav-Index-Attribut

Wie verwende ich das CSS-Navigationsindex-Attribut?

Definition und Verwendung

Das nav-index-Attribut gibt die sequentielle Navigationsreihenfolge („Tab-Reihenfolge“) von Elementen an.

Standard: automatisch

Vererbung: nein

Version: CSS3

JavaScript-Syntax:

object.style.navIndex=2
Nach dem Login kopieren

CSS3-Syntax

nav-index: auto|number|inherit;
Nach dem Login kopieren

Attributwert

auto Die vom Browser zugewiesenen Navigationstasten steuern die Reihenfolge der Elemente.

Zahl gibt die Navigationstasten-Steuerungsreihenfolge des Elements an. 1 stellt den ersten dar.

inherit gibt an, dass der Wert des nav-index-Attributs vom übergeordneten Element geerbt werden soll.

Instanz

Gibt an, wohin bei Verwendung der Pfeiltasten navigiert werden soll:

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;
}
Nach dem Login kopieren

Effektausgabe:

So verwenden Sie das CSS-Nav-Index-Attribut

Browser-Unterstützung: Derzeit unterstützt nur Opera das Nav-Index-Attribut.

Das obige ist der detaillierte Inhalt vonSo verwenden Sie das CSS-Nav-Index-Attribut. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage