aタグ

CSS設定例

a:link    { color: #0000ff; }
a:visited { color: #800080; }
a:active  { text-decoration: none; color: #ff0000; }
a:hover   { text-decoration: underline; color: #ff0000; cursor: pointer; }

カーソルは通常は矢印であるが、カーソルをリンクの上にくると、手形(pointer)に変わる。

Aタグのtarget属性

このページのリファレンスは次のように記述している。

<a href="http://lab.agr.hokudai.ac.jp/useful/CSS/d2_hover_active.htm" target="_new">ポイントした時に下線を表示する(CSS)</a>

targetとして、実在するフレーム名ではなく、_top、_new、_blank など規定の名前を指定することもできる。 それぞれの意味は次の通りである。

属性	値	説明
target=""	_new	新規のウィンドウ(一つ)に表示
	_blank	新規のウィンドウ(複数)に表示
	_self	現在のフレーム（ウィンドウ）に表示
	_parent	親フレームに表示
	_top	フレーム分割を解除してウィンドウ全体に表示
	フレーム名、ウィンドウ名	任意のフレーム（ウィンドウ）に表示

タブブラウザの場合、ブラウザの設定により、上の表で "新規のウィンドウ" が "新規のタブ" に変わる。

小さな画像をクリックすると大きな画像が表示される

下の小さな画像をクリックすると、大きな画像が表示される。

このソースは次の通りである。JavaScriptを使っているわけではなく、aタグ、imgタグの基本機能によっている。

<a href="../my_openstreetmap/zoom16_01.png"> <img src="../my_openstreetmap/zoom16_01.png" width="50"/>

リファレンス