CSS cursor | サンプル書き方 | 実例タグ | プロパティ・セレクタ| 1

cursor CSS コードサンプル DEMO ページ

情報：

CSSはさまざまなマウスカーソルを生成することができる

<!DOCTYPE html>
<html>
<head>
<title>CSS cursor Example</title>
<style>
p {
 display: inline-block;
 padding: 2px 6px;
 border: 1px solid cornflowerblue;
 border-radius: 4px;
} 
.alias {cursor: alias;}
.all-scroll {cursor: all-scroll;}
.auto {cursor: auto;}
.cell {cursor: cell;}
.context-menu {cursor: context-menu;}
.col-resize {cursor: col-resize;}
.copy {cursor: copy;}
.crosshair {cursor: crosshair;}
.default {cursor: default;}
.e-resize {cursor: e-resize;}
.ew-resize {cursor: ew-resize;}
.grab {cursor: -webkit-grab; cursor: grab;}
.grabbing {cursor: -webkit-grabbing; cursor: grabbing;}
.help {cursor: help;}
.move {cursor: move;}
.n-resize {cursor: n-resize;}
.ne-resize {cursor: ne-resize;}
.nesw-resize {cursor: nesw-resize;}
.ns-resize {cursor: ns-resize;}
.nw-resize {cursor: nw-resize;}
.nwse-resize {cursor: nwse-resize;}
.no-drop {cursor: no-drop;}
.none {cursor: none;}
.not-allowed {cursor: not-allowed;}
.pointer {cursor: pointer;}
.progress {cursor: progress;}
.row-resize {cursor: row-resize;}
.s-resize {cursor: s-resize;}
.se-resize {cursor: se-resize;}
.sw-resize {cursor: sw-resize;}
.text {cursor: text;}
.url {cursor: url("/img/demo/fish.png"),auto;}
.w-resize {cursor: w-resize;}
.wait {cursor: wait;}
.zoom-in {cursor: zoom-in;}
.zoom-out {cursor: zoom-out;}
</style>
</head>
<body>
<h1>cursor CSS プロパティ Example</h1> 
<h2>各、テキストにマウスを置くと、マウスカーソルが変わります</h2>
alias
all-scroll
auto
cell
context-menu
col-resize
copy
crosshair
default
e-resize
ew-resize
grab
grabbing
help
move
n-resize
ne-resize
nesw-resize
ns-resize
nw-resize
nwse-resize
no-drop
none
not-allowed
pointer
progress
row-resize
s-resize
se-resize
sw-resize
text
url
w-resize
wait
zoom-in
zoom-out
</body>
</html>

cursorサンプル実行結果

：cursor ・ cursor, コード関連記事

全てリセット

CSS cursor | サンプル書き方 | 実例 DEMO タグ | プロパティ・セレクタ | 1 | 書き方 — CSS cursor | サンプル書き方 | 実例タグ | プロパティ・セレクタ | 1 – WebRef

2018-07-04css-demo

CSS cursor | サンプル 書き方 | 実例 DEMO タグ | プロパティ・セレクタ| 1 | 書き方

cursor CSS コード サンプル DEMO ページ

Html

Glossary

PHP

JavaScript

JQuery

CSS

CSS cursor | サンプル書き方 | 実例 DEMO タグ | プロパティ・セレクタ| 1 | 書き方

cursor CSS コードサンプル DEMO ページ