【CSS】cursor - カーソルのスタイル

【CSS】cursor - カーソルのスタイル

CSSのcursorプロパティについて解説します。

検証環境

cursor

cursorは“カーソル(マウスなど)のスタイル”のプロパティです。

基本構文

cursor: 値;

代表的な値は次の通りです。

意味
auto ユーザーエージェント(ブラウザ)の仕様
help ヘルプカーソル
pointer 指カーソル
progress 処理中カーソル
wait 待機カーソル
text テキストカーソル

サンプル

help

<style>
p {
    ___ih_hl_start
    cursor: help;
    ___ih_hl_end
}
</style>

<p>CSS : Cascading Style Sheets</p>

pointer

<style>
p {
    ___ih_hl_start
    cursor: pointer;
    ___ih_hl_end
}
</style>

<p>CSS : Cascading Style Sheets</p>

progress

<style>
p {
    ___ih_hl_start
    cursor: progress;
    ___ih_hl_end
}
</style>

<p>CSS : Cascading Style Sheets</p>

wait

<style>
p {
    ___ih_hl_start
    cursor: wait;
    ___ih_hl_end
}
</style>

<p>CSS : Cascading Style Sheets</p>

text

<style>
p {
    ___ih_hl_start
    cursor: text;
    ___ih_hl_end
}
</style>

<p>CSS : Cascading Style Sheets</p>