カーソルの使い方は？ CSS でカーソル属性を使用する方法とオプションの値を解析する方法

ページをレイアウトするとき、CSS は作業の重要な部分です。「HTML は化粧をしていない人の姿であり、CSS を追加するのは化粧をした人の姿です」という言葉をよく聞きます。この文章はCSSとHTMLの関係をわかりやすく説明しています。 CSS には多くの属性があります。今日は、CSS のカーソル属性とその多くのオプションの値に焦点を当てます。たとえば、カーソルの手の形状では、cursor:pointer 属性が使用されます。

カーソルの使い方?

1. CSS カーソルの基本構文

カーソル属性とは: マウス ポインターが要素の境界内に置かれたときに表示されるカーソルの形状を指します。これには、疑問符、小さな手、その他の形状が含まれます。
使用する場合は、追加したいタグにstyle="cursor: 特定の属性値"を挿入するか、CSSスタイルに追加することができます。

例:

ポインター、小さな手の形状

、ヘルプ、ヘルプの形状 > 。

カーソルの属性値には十数個のオプション値があります。作業中の必要に応じて適切な値を選択してください。

2. CSS カーソル属性値

1. 最も一般的に使用されるカーソル: ポインター。カーソルは小さな手の形をします。

<p style="cursor:pointer">pointer</p>

2. カーソル: ヘルプ、疑問符カーソル

<p style="cursor:help;">pointer</p>

3. カーソル: クロスヘア、十字カーソル

<p style="cursor:crosshair;">pointer</p>

他の属性値も同様に記述します。属性値を変更するだけです。具体的な値とその意味については以下を参照してください。

default: デフォルトのカーソル、通常は矢印
auto: デフォルトでは、ブラウザによって設定されたカーソル
crosshair: カーソルは十字線を表します
pointer: カーソルはリンクを示すポインター (手) を表します
move:カーソルは移動可能なオブジェクトを表します 移動
e-resize: カーソルは長方形のボックスの端が右に移動できることを示します
ne-resize: カーソルは長方形のボックスの端が上に移動できることを示し、右へ
nw-resize: カーソルは、長方形のボックスの端が上および右に移動できることを示します 左に移動します
n-resize: カーソルは、長方形のボックスの端が上に移動できることを示します
se-サイズ変更: カーソルは、長方形のボックスの端が下および右に移動できることを示します
sw-resize: カーソルは、長方形のボックスの端が移動できることを示します 下および左に移動します
s-resize: カーソルは、長方形のボックスの端が下に移動できることを示します
w-resize: カーソルは長方形のボックスの端が左に移動できることを示します
text: カーソルはテキストを示します
wait: カーソルはプログラムがビジーであることを示します (通常は表または砂時計)
ヘルプ: カーソルはヘルプ (通常は疑問符) を表します

上記では主に CSS でのカーソル属性の使用法とさまざまな属性値の意味を紹介しています。初心者でもエディターを使用できます。さまざまな値を試してください。それがどのような効果があるかを見てください。

以上がカーソルの使い方は？ CSS でカーソル属性を使用する方法とオプションの値を解析する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。