Home/Menu

スタイルなCSSの基礎講座

カーソル

◆ はじめに

つぎは、カーソルのプロパティです。
カーソルの形状をいろいろ変えられます。

尚、ご使用のブラウザのスタイルシート対応度によって、表示が異なる場合があります。

◆ cursorプロパティ

cursorプロパティは、マウスのカーソルの形状を設定します。
設定値とサンプルは、以下の通りです。
マウスのカーソルを飯田史彦氏の引用部分にポイントしてください。形状が変化するはずです。

適用要素初期値継承対応ブラウザ(NN6,IE5.5のみテスト)
全要素autoyesNN6,IE5.5ともにまあまあ
auto(初期値)
普通の状態で、自動的にカーソルをブラウザが切り替えてくれます。

今、この瞬間から、自分を変えるんです。そうすれば、その瞬間に、十年後、二十年後の、 あなたの未来も変わるんですよ!

By 飯田史彦
----------CSS2 ソース------------------------------------------------
.cursorsmp1{
    cursor: auto;
}
---------- HTML4.01 ソース ------------------------------------------
<blockquote>
<p class="cursorsmp1">
今、この瞬間から、自分を変えるんです。そうすれば、その瞬間に、十年後、二十年後の、
あなたの未来も変わるんですよ!
</p>
<div style="text-align: right">By 飯田史彦<div> 
</blockquote>

以下、CSS2 ソースとHTML4.01 ソースは同様なので割愛します!

crosshair
十字型のカーソルになります。

ブレークスルー思考とはズバリ!!
目の前にある壁(問題や障害物)そのものに価値を見出し、すべて「順調な試練」として受け止めることにより、その壁を自分の中に吸収しながら成長をはかり、一見閉じられているかのように見える状況を楽々と突破していくような発想法。

By 飯田史彦
default
デフォルトのカーソルになります。一般的には矢印型です。

生まれてきた目的は...。
夢をつかむことではなく、夢に精一杯挑戦したかどうかという精神的成果をつかむこと...。

By 飯田史彦
pointer
リンク部を指す場合と同じ形状になります。

人生で何かの選択に迷ったときは...。
どちらの方向へ進むのが、よりワクワクすることができ、ワハハと笑う機会の多い選択になるだろうか... また、より感動する機会の多い選択になるだろうかと考えてみればよい。

By 飯田史彦
move
移動可能な対象を指し示す場合と同じ形状になります。

死ぬということは、「肉体からはなれて生きる」ということでもある。

By 飯田史彦
text
一般的には、「|」みたいな形状になります。

できる範囲で頑張るのなら、誰にだってできます。でも、ぎりぎりの限界まで頑張った後に、さらにあともうひと頑張りできるかどうかということが、一流選手と普通選手との差なのです。

By 飯田史彦
wait
一般的には砂時計、または、腕時計の形状になります。

「若くして亡くなる理由」
「その人たちは、それ以上この世で生きながらえて、成長する必要がありません。なぜなら、自分達の死が、両親の成長(魂をみがく)を早める材料になっているからです。」

By 飯田史彦
help
一般的には「?」の形状になります。。

若くして亡くなった魂も自分の死を後悔することは決してありません。 なぜなら、魂は永遠でまた再会することができるからです。

By 飯田史彦
xx-resize
e-resize,ne-resize,nw-resize,n-resize,se-resize,sw-resize,s-resize,w-resizeがあり、
リサイズ可能な部分を指し示す場合と同じ形状になります。文章をカーソルでなぞって見てください。

今、この瞬間から、自分を変えるんです。そうすれば、その瞬間に、十年後、二十年後の、 あなたの未来も変わるんですよ!

By 飯田史彦
URI
画像になります。(現状、N6,IE5.5でもサポートされていません。しかし、IE6はサポートされました。)

死後にも意識があった場合、否定論者は自分の誤りを知るが、死後に意識がない場合、肯定論者は自分の誤りを知ることもない。

By 飯田史彦

Home/Menu/スタイルシート概説リファレンス