ホーム HTML CSS XML JAVASCRIPT   PHP SQL MORE...   リファレンス 事例集    

HTML5 チュートリアル

HTML5 ホーム
HTML5 概要
HTML5 新しい要素
HTML5 ビデオ
HTML5 ビデオ/DOM
HTML5 オーディオ
HTML5 キャンバス
HTML5 Geolocation
HTML5 Web ストレージ

HTML5 フォーム

HTML5 Input タイプ
HTML5 フォーム要素
HTML5 フォーム属性

HTML5 リファレンス

HTML5 タグ
HTML5 属性
HTML5 イベント
HTML5 キャンバス 2d
HTML 妥当な DTD

HTML5 タグ

<!-->
<a>
<abbr>
<acronym>
<address>
<applet>
<area>
<article>
<aside>
<audio>
<b>
<base>
<basefont>
<bdi>
<bdo>
<big>
<blockquote>
<body>
<br>
<button>
<canvas>
<caption>
<center>
<cite>
<code>
<col>
<colgroup>
<command>
<datalist>
<dd>
<del>
<details>
<dfn>
<dir>
<div>
<dl>
<dt>
<em>
<embed>
<fieldset>
<figcaption>
<figure>
<font>
<footer>
<form>
<frame>
<frameset>
<h1> - <h6>
<head>
<header>
<hgroup>
<hr>
<html>
<i>
<iframe>
<img>
<input>
<ins>
<keygen>
<kbd>
<label>
<legend>
<li>
<link>
<map>
<mark>
<menu>
<meta>
<meter>
<nav>
<noframes>
<noscript>
<object>
<ol>
<optgroup>
<option>
<output>
<p>
<param>
<pre>
<progress>
<q>
<rp>
<rt>
<ruby>
<s>
<samp>
<script>
<section>
<select>
<small>
<source>
<span>
<strike>
<strong>
<style>
<sub>
<summary>
<sup>
<table>
<tbody>
<td>
<textarea>
<tfoot>
<th>
<thead>
<time>
<title>
<tr>
<track>
<tt>
<u>
<ul>
<var>
<video>
<wbr>

HTML5 <area> タグ

クリック可能なエリアを持つイメージマップ:

<img src ="planets.gif" width="145" height="126" alt="Planets" usemap ="#planetmap" />

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun" />
  <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury" />
  <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus" />
</map>

Try it yourself »

ブラウザ・サポート

Internet Explorer Firefox Opera Google Chrome Safari

<area> タグは、主要な全ブラウザがサポートしています。


定義と用法

<area> タグは、イメージマップの中のエリアを定義します(イメージマップは、クリック可能なエリアを持つイメージです)。

<area> 要素は、常に <map> タグの中にネストします。

注: <img> タグの usemap 属性は、 map 要素の name 属性と結びついて、イメージとマップの間の関係を作成します。


HTML 4.01 と HTML5 との相違点

HTML5 には、いくつかの新しい属性がサポートされると共に、HTML4.01属性のいくつかのはサポートされなくなりました。


属性

New : HTML5 で新規追加。

属性 説明
alt text area の代替テキストを指定する。href 属性があれば必須
coords coordinates area の座標を指定する
href URL area へのハイパーリンクのターゲットを指定する
hreflangNew language_code ターゲット URL の言語を指定
mediaNew media query ターゲット URL が、どのようなメディア/デバイスに最適化されているかを指定する
nohref nohref HTML5 ではサポートしていない
relNew alternate
author
bookmark
help
license
next
nofollow
noreferrer
prefetch
prev
search
tag
現在の文書と、ターゲット URL 間の関係を指定する
shape default
rect
circle
poly
area の形状を指定する
target _blank
_parent
_self
_top
framename
ターゲット URL をどこにオープンするかを指定する
typeNew MIME_type ターゲット URL の MIME タイプを指定する

グローバル属性

<area> タグは、HTML5におけるグローバル属性 もサポートします。


イベント属性

<area> タグは、HTML5におけるイベント属性 もサポートします。