Was bedeutet das HTML-Area-Tag? Detaillierte Erläuterung der Verwendung des HTML-Area-Tags-HTML-Tutorial-php.cn

Was bedeutet das HTML-Area-Tag? Detaillierte Erläuterung der Verwendung des HTML-Area-Tags

寻∝梦

Freigeben： 2018-08-17 17:37:12

Original

4754 Leute haben es durchsucht

Was bedeutet das HTML-Area-Tag? Wie viel wissen Sie über die Verwendung von HTML-Area-Tags? In diesem Artikel werden Ihnen die Definition und Verwendungsfälle des HTML-Area-Tags sowie eine Einführung in die Attribute des HTML-Area-Tags (mit Beispielen) vorgestellt.

Die Definition und Verwendung des HTML Bereichs-Tag:

definiert den Bereich in der Bildkarte (Hinweis: Bildkarte bezieht sich auf ein Bild mit einem anklickbaren Bereich).

Bereichselemente sind immer in -Tags verschachtelt.

Hinweis: Das usemap-Attribut im -Tag ist mit dem name-Attribut des Kartenelements verknüpft, wodurch eine Verbindung zwischen dem Bild und der Karte hergestellt wird.

HTML-Tag-Instanz:

Bildkarte mit anklickbarem Bereich:

<img src="planets.jpg" border="0" usemap="#planetmap" alt="Planets" />
<map name="planetmap" id="planetmap">
  <area shape="circle" coords="180,139,14" href ="venus.html" alt="Venus" />
  <area shape="circle" coords="129,161,10" href ="mercur.html" alt="Mercury" />
  <area shape="rect" coords="0,0,110,260" href ="sun.html" alt="Sun" />
</map>

Nach dem Login kopieren

-Tag-Attribut:

alt: Alt-Text für den Bereich.
Koordinaten: die Koordinaten des Gebiets.
href: Die Ziel-URL des Bereichs.
hreflang: Die Sprache der Ziel-URL, ein neues Attribut in HTML5.
Medien: Für welches Medium/Gerät die Ziel-URL optimiert ist, ein neues Attribut in HTML5.
nohref: Es gibt keinen verwandten Linkbereich, HTML5 unterstützt ihn nicht.
rel: Die Beziehung zwischen dem aktuellen Dokument und der Ziel-URL, ein neues Attribut in HTML5.
Form: die Form des Bereichs.
Ziel: Wo soll die Ziel-URL geöffnet werden.
Typ: MIME-Typ der Ziel-URL, ein neues Attribut in HTML5.

Format:

HTML-Tag-Beispiel:

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>html< area>标签_PHP笔记</title>
</head>
<body>
<img src="http://www.php.cn/themes/Nana2.09/images/logo.png" alt="html< area>标签" width="300px" height="70px" alt="PHP笔记logo" usemap="#logo">
<map name="logo">
<area shape="rect" coords="0,0,70,70" alt="图标" href="#">
<area shape="rect" coords="85,0,280,50" alt="PHP笔记" href="#">
<area shape="rect" coords="85,50,275,70" alt="www.php.cn" href="#">
</map>
<h3>上面图片被分为3个区域</h3>
</body>
</body>
</html>

Nach dem Login kopieren

Hinweis: Das usemap-Attribut in kann auf das id- oder name-Attribut in verweisen, daher benötigen wir Um beides zu verwenden, fügen Sie zwei Attribute, ID und Name, zu hinzu.

Unterschiede zwischen HTML und XHTML

In HTML hat kein schließendes Tag.

In XHTML muss ordnungsgemäß geschlossen werden.

[Verwandte Empfehlungen]

Wozu dient der HTML5-Quelltyp? Detaillierte Einführung in das HTML5-Quell-Tag

Welche Rolle spielt das Skript-Tag in HTML? Wozu dient das Typattribut im Skript-Tag?

Das obige ist der detaillierte Inhalt vonWas bedeutet das HTML-Area-Tag? Detaillierte Erläuterung der Verwendung des HTML-Area-Tags. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!