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

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

Aug 17, 2018 pm 05:37 PM

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>

-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="//m.sbmmt.com/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="m.sbmmt.com" href="#">
</map>
<h3>上面图片被分为3个区域</h3>
</body>
</body>
</html>

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!

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

Heiße KI -Werkzeuge

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Clothoff.io

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Wie minimiere ich die Größe von HTML -Dateien? Wie minimiere ich die Größe von HTML -Dateien? Jun 24, 2025 am 12:53 AM

Um die Größe von HTML -Dateien zu verringern, müssen Sie redundante Code bereinigen, den Inhalt komprimieren und die Struktur optimieren. 1. Löschen Sie ungenutzte Tags, Kommentare und zusätzliche Rohlinge, um das Volumen zu verringern. 2. Verschieben Sie das Inline -CSS und JavaScript in externe Dateien und verschmelzen Sie mehrere Skripte oder Stilblöcke. 3.. Vereinfachen Sie die Beschriftungssyntax ohne die Parsen zu beeinflussen, z. 4. Aktivieren Sie nach der Reinigung serverseitige Komprimierungstechnologien wie Gzip oder Brotli, um das Übertragungsvolumen weiter zu reduzieren. Diese Schritte können die Seitenladungsleistung erheblich verbessern, ohne die Funktionalität zu beeinträchtigen.

Wie hat sich HTML im Laufe der Zeit entwickelt und was sind die wichtigsten Meilensteine ​​in seiner Geschichte? Wie hat sich HTML im Laufe der Zeit entwickelt und was sind die wichtigsten Meilensteine ​​in seiner Geschichte? Jun 24, 2025 am 12:54 AM

HtmlhasevolvedSignificantantySinceScreationTomeettHegrowingDemandSofwebDevelopers und intellentialsimplemarkUplanguageForSharingDocuments, ithasundergonemajorupdates, einschließlich html2.0, die störungslichformungen;

Wie benutze ich das Element , um die Fußzeile eines Dokuments oder Abschnitts darzustellen? Wie benutze ich das Element , um die Fußzeile eines Dokuments oder Abschnitts darzustellen? Jun 25, 2025 am 12:57 AM

Es handelt sich um ein in HTML5 verwendetes semantisches Tag, um den Ende der Seite oder des Inhaltsblocks zu definieren. In der Regel enthält Copyright -Informationen, Kontaktinformationen oder Navigationslinks. Es kann am Ende der Seite platziert oder in usw. verschachtelt werden. Tags als Ende des Blocks; Wenn Sie es verwenden, sollten Sie darauf achten, wiederholten Missbrauch und irrelevante Inhalte zu vermeiden.

Wie verwende ich das Tabindex -Attribut, um die Registerkarte der Elemente zu steuern? Wie verwende ich das Tabindex -Attribut, um die Registerkarte der Elemente zu steuern? Jun 24, 2025 am 12:56 AM

ThetabIndexattributeControlShowelementsReceifocusviathetabkey, WithhreeMainValues: tabindex = "0" addSanelementTothenaturaltaborder, tabindex = "-1" erlaubt Prograrataticfocusonly und tabindex = "n" (positivenumn) setsacustomtabbing

Wie erstelle ich Textbereiche in HTML mithilfe des Elements ? Wie erstelle ich Textbereiche in HTML mithilfe des Elements ? Jun 25, 2025 am 01:07 AM

Um HTML -Textbereiche zu erstellen, verwenden Sie Elemente und passen Sie sie durch Attribute und CSS an. 1. Verwenden Sie die grundlegende Syntax, um den Textbereich zu definieren und Eigenschaften wie Zeilen, Cols, Name, Platzhalter usw. Zu setzen; 2. Sie können die Größe und den Stil durch CSS wie Breite, Höhe, Polsterung, Rand usw. genau steuern; 3. Bei der Übermittlung des Formulars können Sie die Daten über das Namensattribut identifizieren und den Wert für die Front-End-Verarbeitung erhalten.

Was ist die  deklaration und was macht es? Was ist die deklaration und was macht es? Jun 24, 2025 am 12:57 AM

AdeclarationisaformalStatementthatsomethething, offiziell, orrequired, verwendet toclearlyDefineorannounceanintent, fact, orrule

Wie benutze ich die Elemente Wie benutze ich die Elemente Jun 24, 2025 am 12:45 AM

Die Standardmethode zum Hinzufügen von Titeln zu Bildern in HTML ist die Verwendung und Elemente. 1. Die grundlegende Verwendung besteht darin, das Bild in das Tag zu wickeln und einen Titel hinzuzufügen, zum Beispiel: Dies ist der Titel des Bildes; 2. Die Gründe für die Verwendung dieser beiden Tags sind eindeutige Semantik, bequeme Stilkontrolle und eine starke Zugänglichkeit, die dem Browser-, Crawler- und Screen -Leser hilft, die Inhaltsstruktur zu verstehen. 3. Die Hinweise enthalten, dass es auf und ab platziert werden kann, aber die logische Reihenfolge beibehalten muss, das Alt -Attribut nicht ersetzen kann und mehrere Medienelemente enthalten kann, um eine ganze Einheit zu bilden.

Anwendung der semantischen Struktur mit Artikel, Abschnitt und beiseite in HTML Anwendung der semantischen Struktur mit Artikel, Abschnitt und beiseite in HTML Jul 05, 2025 am 02:03 AM

Die rationale Verwendung semantischer Tags in HTML kann die Klarheit, Zugänglichkeit und SEO -Effekte der Seitenstruktur verbessern. 1. für unabhängige Inhaltsblöcke wie Blog-Beiträge oder Kommentare muss sie in sich geschlossen werden. 2. für klassifizierungsbezogene Inhalte, die normalerweise Titel enthalten, ist für verschiedene Module der Seite geeignet. 3.. Wird für Hilfsinformationen im Zusammenhang mit dem Hauptinhalt verwendet, nicht jedoch Kern, wie z. B. Seitenleistenempfehlungen oder Autorprofile. In der tatsächlichen Entwicklung sollten Etiketten kombiniert und andere, übermäßige Verschachtelung vermeiden, die Struktur einfach halten und die Rationalität der Struktur durch Entwicklerwerkzeuge überprüfen.

See all articles