かんたん作成.com【HTML,CSS,JavaScript,CGI,PHP】
|
|
|
カーソルの形を指定(cursor)
<html>
<head>
<title>カーソルの形を指定</title>
<style type="text/css">
<!--
.c1 {
cursor: hand;
}
.c2 {
cursor: crosshair;
}
.c3 {
cursor: move;
}
.c4 {
cursor: e-resize;
}
.c5 {
cursor: w-resize;
}
.c6 {
cursor: n-resize;
}
.c7 {
cursor: s-resize;
}
.c8 {
cursor: ne-resize;
}
.c9 {
cursor: nw-resize;
}
.c10 {
cursor: se-resize;
}
.c11 {
cursor: sw-resize;
}
.c12 {
cursor: text;
}
.c13 {
cursor: wait;
}
.c14 {
cursor: help;
}
.c15 {
cursor: default;
}
//-->
</style>
</head>
<body>
<div class="c1">手の形</div>
<br>
<div class="c2">十字型</div>
<br>
<div class="c3">十字型矢印</div>
<br>
<div class="c4">右矢印</div>
<br>
<div class="c5">左矢印</div>
<br>
<div class="c6">上矢印</div>
<br>
<div class="c7">下矢印</div>
<br>
<div class="c8">右上矢印</div>
<br>
<div class="c9">左上矢印</div>
<br>
<div class="c10">右下矢印</div>
<br>
<div class="c11">左下矢印</div>
<br>
<a class="c12" href="../sample/sample.html">テキスト型</a><br>
<br>
<a class="c13" href="../sample/sample.html">砂時計型</a><br>
<br>
<a class="c14" href="../sample/sample.html">ヘルプ型</a><br>
<br>
<a class="c15" href="../sample/sample.html">通常の矢印</a><br>
</body>
</html>
実行する
|
当サイトはリンクフリーです。
<a href="http://www.kantansakusei.com/">かんたん作成.com【HTML,CSS,JavaScript,CGI,PHP】</a>
|