図片 図片
検索

ホームページ  >  記事  >  ウェブフロントエンド  >  HTML Mapタグの使用

HTML Mapタグの使用

巴扎黑
巴扎黑オリジナル
2017-06-27 13:37:563459ブラウズ

今日JD.comでマーケティングキャンペーンを見かけました。左側のfloatingnavigationがHTMLのmapタグを使って書かれていたので、それを記録するためにこの記事を思いつきました。

上の写真は、その中の主な家電製品を直接示しています

HTML Mapタグの使用

<p class="content">
	<img src="https://img.php.cn/upload/article/000/000/007/036cb8017291b49666f84f83d250e50f-0.png" usemap="#Mapslide" alt="HTML Mapタグの使用" />
	<map name="Mapslide" id="Mapslide">
		<area shape="rect" coords="0,66,64,90" href="http://www.5itbao.cn" target="_blank" clstag="sale|keycount|8295365|1" />
	</map>
</p>

ちなみに、いくつかの関連情報を抜粋しました:

HTML クリック可能な領域のある画像マッピング。

すべての主要なブラウザは タグをサポートしています。

定義と使用法

クライアントイメージマップを定義します。イメージマップとは、クリック可能な領域のある画像を指します。

ヒントと注意事項:

注:

area要素は常にmap要素内にネストされます。 area 要素は、イメージ マップ内のエリアを定義します。

注:

HTML Mapタグの使用 の usemap 属性 は、

の id または name 属性を参照できるため、id と name の両方を に追加する必要があります。属性。

HTMLとXHTMLの違い HTMLでは、には終了タグがありません。

XHTML では、 を正しく閉じる必要があります。

エリアプロパティ

プロパティ 値 説明
coords 座標値 クリック可能な領域（マウスに反応する領域）の座標を定義します。
href URL このゾーンのターゲット URL を定義します。
nohref nohref 画像マップから領域を除外します。領域の形状を定義します。
target

  • _blank

  • _parent

  • _self

  • _top

 は、href属性を開く場所を指定します
を意味します


HTML DOM Area オブジェクト


Area オブジェクト

Area オブジェクトは、HTML ドキュメント内の画像マッピングの領域を表します (画像マッピングとは、クリック可能な領域を持つ画像を指します)

タグが出現するたびに、Area オブジェクトが作成されます。


エリアオブジェクトのプロパティ

Property Description
accessKey エリアにアクセスするためのショートカットキーを設定または返します。
alt ブラウザが特定の領域を表示できない場合に、代替テキストを設定または返します。
coords イメージマップ内のクリック可能な領域の座標を設定または返します。
hash リージョン内の URL のアンカー部分を設定または返します。
host 特定のゾーンの URL のホスト名とポートを設定または返します。
href イメージマップ内のリンクの URL を設定または返します。
id 特定のエリアのIDを設定または返します。
noHref 領域をアクティブにするか非アクティブにするかを設定または返します。
pathname ゾーン内の URL のパス名を設定または返します。
protocol 特定のゾーンの URL のプロトコルを設定または返します。
search 特定の領域の URL のクエリ string 部分を設定または返します。
shape イメージマップ内の領域の形状を設定または返します。
tabIndex 特定の領域のタブキー制御順序を設定または返します。
target ゾーン内のリンク URL を開く場所を設定または返します。


標準プロパティ

Property Description
className 要素のクラス属性を設定または返します。
dir テキストの方向を設定または返します。
lang 要素の言語コードを設定または返します。
title 要素のタイトルを設定または返します。

以上がHTML Mapタグの使用の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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

関連記事

続きを見る