☆ カーソル・ポインタの形を変える ☆





上下左右斜めの矢印を選択した場合、ＩＥ6.0以上では⇔のような矢印に見えます。
とっても見づらいので、リンクには矢印を選択しないことをおすすめします（;￣ー￣A　





【ページ全体に適用】する場合は、このタグを<HEAD>と</HEAD>の間に入れてください。
【指定した文字やリンクに適用】する場合は、そのまま好きなところに入れてください。


上
n-resize


【ページ全体のカーソルに適用】
<STYLE type="text/css"><!--BODY{cursor : n-resize;}--></STYLE>

【ページ全体のリンクに適用】
<STYLE type="text/css"><!--a{cursor : n-resize;}--></STYLE>

【指定した文字に適用】
<SPAN style=cursor:n-resize;>ここに文字</SPAN>

【特定のリンクに適用】
<A href="○○.htm" style="cursor : n-resize;">リンク</A>

下
s-resize


【ページ全体のカーソルに適用】
<STYLE type="text/css"><!--BODY{cursor : s-resize;}--></STYLE>

【ページ全体のリンクに適用】
<STYLE type="text/css"><!--a{cursor : s-resize;}--></STYLE>

【指定した文字に適用】
<SPAN style=cursor:s-resize;>ここに文字</SPAN>

【特定のリンクに適用】
<A href="○○.htm" style="cursor : s-resize;">リンク</A>

右
e-resize


【ページ全体のカーソルに適用】
<STYLE type="text/css"><!--BODY{cursor : e-resize;}--></STYLE>

【ページ全体のリンクに適用】
<STYLE type="text/css"><!--a{cursor : e-resize;}--></STYLE>

【指定した文字に適用】
<SPAN style=cursor:e-resize;>ここに文字</SPAN>

【特定のリンクに適用】
<A href="○○.htm" style="cursor : e-resize;">リンク</A>

左
w-resize


【ページ全体のカーソルに適用】
<STYLE type="text/css"><!--BODY{cursor : w-resize;}--></STYLE>

【ページ全体のリンクに適用】
<STYLE type="text/css"><!--a{cursor : w-resize;}--></STYLE>

【指定した文字に適用】
<SPAN style=cursor:w-resize;>ここに文字</SPAN>

【特定のリンクに適用】
<A href="○○.htm" style="cursor : w-resize;">リンク</A>

右上
ne-resize


【ページ全体のカーソルに適用】
<STYLE type="text/css"><!--BODY{cursor : ne-resize;}--></STYLE>

【ページ全体のリンクに適用】
<STYLE type="text/css"><!--a{cursor : ne-resize;}--></STYLE>

【指定した文字に適用】
<SPAN style=cursor:ne-resize;>ここに文字</SPAN>

【特定のリンクに適用】
<A href="○○.htm" style="cursor : ne-resize;">リンク</A>

右下
se-resize


【ページ全体のカーソルに適用】
<STYLE type="text/css"><!--BODY{cursor : se-resize;}--></STYLE>

【ページ全体のリンクに適用】
<STYLE type="text/css"><!--a{cursor : se-resize;}--></STYLE>

【指定した文字に適用】
<SPAN style=cursor:se-resize;>ここに文字</SPAN>

【特定のリンクに適用】
<A href="○○.htm" style="cursor : se-resize;">リンク</A>

左上
nw-resize


【ページ全体のカーソルに適用】
<STYLE type="text/css"><!--BODY{cursor : nw-resize;}--></STYLE>

【ページ全体のリンクに適用】
<STYLE type="text/css"><!--a{cursor : nw-resize;}--></STYLE>

【指定した文字に適用】
<SPAN style=cursor:nw-resize;>ここに文字</SPAN>

【特定のリンクに適用】
<A href="○○.htm" style="cursor : nw-resize;">リンク</A>

左下
sw-resize


【ページ全体のカーソルに適用】
<STYLE type="text/css"><!--BODY{cursor : sw-resize;}--></STYLE>

【ページ全体のリンクに適用】
<STYLE type="text/css"><!--a{cursor : sw-resize;}--></STYLE>

【指定した文字に適用】
<SPAN style=cursor:sw-resize;>ここに文字</SPAN>

【特定のリンクに適用】
<A href="○○.htm" style="cursor : sw-resize;">リンク</A>

十字
crosshair


【ページ全体のカーソルに適用】
<STYLE type="text/css"><!--BODY{cursor : crosshair;}--></STYLE>

【ページ全体のリンクに適用】
<STYLE type="text/css"><!--a{cursor : crosshair;}--></STYLE>

【指定した文字に適用】
<SPAN style=cursor:crosshair;>ここに文字</SPAN>

【特定のリンクに適用】
<A href="○○.htm" style="cursor : crosshair;">リンク</A>

移動
move


【ページ全体のカーソルに適用】
<STYLE type="text/css"><!--BODY{cursor : move;}--></STYLE>

【ページ全体のリンクに適用】
<STYLE type="text/css"><!--a{cursor : move;}--></STYLE>

【指定した文字に適用】
<SPAN style=cursor:move;>ここに文字</SPAN>

【特定のリンクに適用】
<A href="○○.htm" style="cursor : move;">リンク</A>

ヘルプ
help


【ページ全体のカーソルに適用】
<STYLE type="text/css"><!--BODY{cursor : help;}--></STYLE>

【ページ全体のリンクに適用】
<STYLE type="text/css"><!--a{cursor : help;}--></STYLE>

【指定した文字に適用】
<SPAN style=cursor:help;>ここに文字</SPAN>

【特定のリンクに適用】
<A href="○○.htm" style="cursor : help;">リンク</A>

砂時計
wait


【ページ全体のカーソルに適用】
<STYLE type="text/css"><!--BODY{cursor : wait;}--></STYLE>

【ページ全体のリンクに適用】
<STYLE type="text/css"><!--a{cursor : wait;}--></STYLE>

【指定した文字に適用】
<SPAN style=cursor:wait;>ここに文字</SPAN>

【特定のリンクに適用】
<A href="○○.htm" style="cursor : wait;">リンク</A>

ポインタ
pointer


【ページ全体のカーソルに適用】
<STYLE type="text/css"><!--BODY{cursor : pointer;}--></STYLE>

【ページ全体のリンクに適用】
<STYLE type="text/css"><!--a{cursor : pointer;}--></STYLE>

【指定した文字に適用】
<SPAN style=cursor:pointer;>ここに文字</SPAN>

【特定のリンクに適用】
<A href="○○.htm" style="cursor : pointer;">リンク</A>

デフォルト
default


【ページ全体のカーソルに適用】
<STYLE type="text/css"><!--BODY{cursor : default;}--></STYLE>

【ページ全体のリンクに適用】
<STYLE type="text/css"><!--a{cursor : default;}--></STYLE>

【指定した文字に適用】
<SPAN style=cursor:default;>ここに文字</SPAN>

【特定のリンクに適用】
<A href="○○.htm" style="cursor : default;">リンク</A>



このタグを<HEAD>と</HEAD>の間に入れてください。
ページ全体に適用されます。
<STYLE type="text/css">
<!--
BODY{
cursor : crosshair;/*ページ全体のカーソルを十字に*/
}
A{
cursor : help;/*リンクをヘルプに*/
}
TABLE{
cursor : wait;/*表の中を砂時計に*/
}
-->
</STYLE>
特定の枠のポインタの形を変える


ヘルプ


<TABLE cellspacing="1" bgcolor="#d8d8eb" cellpadding="3" style="cursor : help;">
<TBODY>
<TR>
<TD nowrap bgcolor="#fafafc" align="center"><FONT color="#bfbfbf" size="2">ヘルプ</FONT></TD>
</TR>
</TBODY>
</TABLE>




Copyright (C) 2001-2014. Various Colors . All rights reserved.