ホームページ > 記事 > ウェブフロントエンド > CSS カーソル プロパティの定義と使用法
CSS カーソル プロパティの定義と使用法
- 零下一度オリジナル
- 2017-07-03 11:04:201354ブラウズ
cursor
1. 定義と使い方
カーソル属性は、表示するカーソルの種類（形状）を指定します。
この属性は、マウス ポインターが要素の境界内に置かれたときに使用されるカーソルの形状を定義します (ただし、CSS2.1 では、どの境界がこの範囲を決定するか定義していません)。
2. 属性
| url |
使用されるカスタム カーソルの URL。 注: URL で定義された使用可能なカーソルがない場合に備えて、常にこのリストの最後に通常のカーソルを定義してください。 |
| default | デフォルトのカーソル（通常は矢印） |
| auto | デフォルト。ブラウザによって設定されたカーソル。 |
| 十字線 | カーソルは十字線として表示されます。 |
| ポインター | カーソルはリンクを示すポインター(手)として描画されます |
| move | このカーソルはオブジェクトが移動できることを示します。 |
| e-resize | このカーソルは、長方形のボックスの端を右 (東) に移動できることを示します。 |
| ne-resize | このカーソルは、長方形のボックスの端を上と右 (北/東) に移動できることを示します。 |
| nw-resize | このカーソルは、長方形のボックスの端を上と左 (北/西) に移動できることを示します。 |
| n-resize | このカーソルは、長方形のボックスの端を上 (北) に移動できることを示します。 |
| se-resize | このカーソルは、長方形のボックスの端を下と右 (南/東) に移動できることを示します。 |
| sw-resize | このカーソルは、長方形のボックスの端を下と左 (南/西) に移動できることを示します。 |
| s-resize | このカーソルは、長方形のボックスの端を下 (南) に移動できることを示します。 |
| w-resize | このカーソルは、長方形のボックスの端を左(西)に移動できることを示します。 |
| テキスト | このカーソルはテキストを示します。 |
| wait | このカーソルは、プログラム (通常は時計または砂時計) がビジーであることを示します。 |
| ヘルプ | このカーソルは、利用可能なヘルプ (通常は疑問符またはバルーン) を示します。 |
3. サポートされているブラウザ
すべての主要なブラウザはカーソル属性をサポートしています。
注: Opera 9.3 と Safari 3 は url 値をサポートしていません。
注: 属性値「inherit」は、Internet Explorer (IE8 を含む) のどのバージョンでもサポートされていません。
4.html コード
<html> <body> <p>请把鼠标移动到单词上，可以看到鼠标指针发生变化：</p> <span style="cursor:auto">Auto</span><br /> <span style="cursor:crosshair">Crosshair</span><br /> <span style="cursor:default">Default</span><br /> <span style="cursor:pointer">Pointer</span><br /> <span style="cursor:move">Move</span><br /> <span style="cursor:e-resize">e-resize</span><br /> <span style="cursor:ne-resize">ne-resize</span><br /> <span style="cursor:nw-resize">nw-resize</span><br /> <span style="cursor:n-resize">n-resize</span><br /> <span style="cursor:se-resize">se-resize</span><br /> <span style="cursor:sw-resize">sw-resize</span><br /> <span style="cursor:s-resize">s-resize</span><br /> <span style="cursor:w-resize">w-resize</span><br /> <span style="cursor:text">text</span><br /> <span style="cursor:wait">wait</span><br /> <span style="cursor:help">help</span> </body> </html>
以上がCSS カーソル プロパティの定義と使用法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事：CSS初期化のサンプルコード次の記事：CSS初期化のサンプルコード