Movatterモバイル変換


[0]ホーム

URL:


Menu
×
See More 
Sign In
+1 Get Certified Upgrade For Teachers Spaces Get Certified Upgrade For Teachers Spaces
   ❮   
     ❯   

CSS References

CSS ReferenceCSS Browser SupportCSS SelectorsCSS CombinatorsCSS Pseudo-classesCSS Pseudo-elementsCSS At-rulesCSS FunctionsCSS Reference AuralCSS Web Safe FontsCSS Fallback FontsCSS AnimatableCSS UnitsCSS PX-EM ConverterCSS ColorsCSS Color ValuesCSS Default ValuesCSS Entities

CSS Properties

accent-coloralign-contentalign-itemsalign-selfallanimationanimation-delayanimation-directionanimation-durationanimation-fill-modeanimation-iteration-countanimation-nameanimation-play-stateanimation-timing-functionaspect-ratiobackdrop-filterbackface-visibilitybackgroundbackground-attachmentbackground-blend-modebackground-clipbackground-colorbackground-imagebackground-originbackground-positionbackground-position-xbackground-position-ybackground-repeatbackground-sizeblock-sizeborderborder-blockborder-block-colorborder-block-endborder-block-end-colorborder-block-end-styleborder-block-end-widthborder-block-startborder-block-start-colorborder-block-start-styleborder-block-start-widthborder-block-styleborder-block-widthborder-bottomborder-bottom-colorborder-bottom-left-radiusborder-bottom-right-radiusborder-bottom-styleborder-bottom-widthborder-collapseborder-colorborder-end-end-radiusborder-end-start-radiusborder-imageborder-image-outsetborder-image-repeatborder-image-sliceborder-image-sourceborder-image-widthborder-inlineborder-inline-colorborder-inline-endborder-inline-end-colorborder-inline-end-styleborder-inline-end-widthborder-inline-startborder-inline-start-colorborder-inline-start-styleborder-inline-start-widthborder-inline-styleborder-inline-widthborder-leftborder-left-colorborder-left-styleborder-left-widthborder-radiusborder-rightborder-right-colorborder-right-styleborder-right-widthborder-spacingborder-start-end-radiusborder-start-start-radiusborder-styleborder-topborder-top-colorborder-top-left-radiusborder-top-right-radiusborder-top-styleborder-top-widthborder-widthbottombox-decoration-breakbox-reflectbox-shadowbox-sizingbreak-afterbreak-beforebreak-insidecaption-sidecaret-color@charsetclearclipclip-pathcolorcolor-schemecolumn-countcolumn-fillcolumn-gapcolumn-rulecolumn-rule-colorcolumn-rule-stylecolumn-rule-widthcolumn-spancolumn-widthcolumns@containercontentcounter-incrementcounter-resetcounter-set@counter-stylecursordirectiondisplayempty-cellsfilterflexflex-basisflex-directionflex-flowflex-growflex-shrinkflex-wrapfloatfont@font-facefont-familyfont-feature-settingsfont-kerning@font-palette-valuesfont-sizefont-size-adjustfont-stretchfont-stylefont-variantfont-variant-capsfont-weightgapgridgrid-areagrid-auto-columnsgrid-auto-flowgrid-auto-rowsgrid-columngrid-column-endgrid-column-startgrid-rowgrid-row-endgrid-row-startgrid-templategrid-template-areasgrid-template-columnsgrid-template-rowshanging-punctuationheighthyphenshyphenate-characterimage-rendering@importinitial-letterinline-sizeinsetinset-blockinset-block-endinset-block-startinset-inlineinset-inline-endinset-inline-startisolationjustify-contentjustify-itemsjustify-self@keyframes@layerleftletter-spacingline-heightlist-stylelist-style-imagelist-style-positionlist-style-typemarginmargin-blockmargin-block-endmargin-block-startmargin-bottommargin-inlinemargin-inline-endmargin-inline-startmargin-leftmargin-rightmargin-topmarkermarker-endmarker-midmarker-startmaskmask-clipmask-compositemask-imagemask-modemask-originmask-positionmask-repeatmask-sizemask-typemax-block-sizemax-heightmax-inline-sizemax-width@mediamin-block-sizemin-inline-sizemin-heightmin-widthmix-blend-mode@namespaceobject-fitobject-positionoffsetoffset-anchoroffset-distanceoffset-pathoffset-positionoffset-rotateopacityorderorphansoutlineoutline-coloroutline-offsetoutline-styleoutline-widthoverflowoverflow-anchoroverflow-wrapoverflow-xoverflow-yoverscroll-behavioroverscroll-behavior-blockoverscroll-behavior-inlineoverscroll-behavior-xoverscroll-behavior-ypaddingpadding-blockpadding-block-endpadding-block-startpadding-bottompadding-inlinepadding-inline-endpadding-inline-startpadding-leftpadding-rightpadding-top@pagepage-break-afterpage-break-beforepage-break-insidepaint-orderperspectiveperspective-originplace-contentplace-itemsplace-selfpointer-eventsposition@propertyquotesresizerightrotaterow-gapscale@scopescroll-behaviorscroll-marginscroll-margin-blockscroll-margin-block-endscroll-margin-block-startscroll-margin-bottomscroll-margin-inlinescroll-margin-inline-endscroll-margin-inline-startscroll-margin-leftscroll-margin-rightscroll-margin-topscroll-paddingscroll-padding-blockscroll-padding-block-endscroll-padding-block-startscroll-padding-bottomscroll-padding-inlinescroll-padding-inline-endscroll-padding-inline-startscroll-padding-leftscroll-padding-rightscroll-padding-topscroll-snap-alignscroll-snap-stopscroll-snap-typescrollbar-colorshape-outside@starting-style@supportstab-sizetable-layouttext-aligntext-align-lasttext-decorationtext-decoration-colortext-decoration-linetext-decoration-styletext-decoration-thicknesstext-emphasistext-emphasis-colortext-emphasis-positiontext-emphasis-styletext-indenttext-justifytext-orientationtext-overflowtext-shadowtext-transformtext-underline-offsettext-underline-positiontoptransformtransform-origintransform-styletransitiontransition-delaytransition-durationtransition-propertytransition-timing-functiontranslateunicode-bidiuser-selectvertical-alignvisibilitywhite-spacewidowswidthword-breakword-spacingword-wrapwriting-modez-indexzoom



CSScursor Property


Example

CSS can generate a bunch of different mouse cursors:

.alias {cursor: alias;}
.all-scroll {cursor: all-scroll;}
.auto {cursor: auto;}
.cell {cursor: cell;}
.col-resize {cursor: col-resize;}
.context-menu {cursor: context-menu;}
.copy {cursor: copy;}
.crosshair {cursor: crosshair;}
.default {cursor: default;}
.e-resize {cursor: e-resize;}
.ew-resize {cursor: ew-resize;}
.grab {cursor: grab;}
.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(myBall.cur),auto;}
.w-resize {cursor: w-resize;}
.wait {cursor: wait;}
.zoom-in {cursor: zoom-in;}
.zoom-out {cursor: zoom-out;}
Try it Yourself »

Definition and Usage

Thecursor property specifies the mouse cursor to be displayed when pointing over an element.

Default value:auto
Inherited:yes
Animatable:no.Read aboutanimatable
Version:CSS2
JavaScript syntax:object.style.cursor="crosshair"Try it

Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Property
cursor5.05.54.05.09.6


CSS Syntax

cursor:value;

Property Values

ValueDescriptionDemo
aliasThe cursor indicates an alias of something is to be createdPlay it »
all-scrollThe cursor indicates that something can be scrolled in any directionPlay it »
autoDefault. The browser sets a cursorPlay it »
cellThe cursor indicates that a cell (or set of cells) may be selectedPlay it »
col-resizeThe cursor indicates that the column can be resized horizontallyPlay it »
context-menuThe cursor indicates that a context-menu is availablePlay it »
copyThe cursor indicates something is to be copiedPlay it »
crosshairThe cursor render as a crosshairPlay it »
defaultThe default cursorPlay it »
e-resizeThe cursor indicates that an edge of a box is to be moved right (east)Play it »
ew-resizeIndicates a bidirectional resize cursorPlay it »
grabThe cursor indicates that something can be grabbedPlay it »
grabbingThe cursor indicates that something can be grabbedPlay it »
helpThe cursor indicates that help is availablePlay it »
moveThe cursor indicates something is to be movedPlay it »
n-resizeThe cursor indicates that an edge of a box is to be moved up (north)Play it »
ne-resizeThe cursor indicates that an edge of a box is to be moved up and right (north/east)Play it »
nesw-resizeIndicates a bidirectional resize cursorPlay it »
ns-resizeIndicates a bidirectional resize cursorPlay it »
nw-resizeThe cursor indicates that an edge of a box is to be moved up and left (north/west)Play it »
nwse-resizeIndicates a bidirectional resize cursorPlay it »
no-dropThe cursor indicates that the dragged item cannot be dropped herePlay it »
noneNo cursor is rendered for the elementPlay it »
not-allowedThe cursor indicates that the requested action will not be executedPlay it »
pointerThe cursor is a pointer and indicates a linkPlay it »
progressThe cursor indicates that the program is busy (in progress)Play it »
row-resizeThe cursor indicates that the row can be resized verticallyPlay it »
s-resizeThe cursor indicates that an edge of a box is to be moved down (south)Play it »
se-resizeThe cursor indicates that an edge of a box is to be moved down and right (south/east)Play it »
sw-resizeThe cursor indicates that an edge of a box is to be moved down and left (south/west)Play it »
textThe cursor indicates text that may be selectedPlay it »
url()A comma separated list of URLs to custom cursors. Note: Always specify a generic cursor at the end of the list, in case none of the URL-defined cursors can be usedPlay it »
vertical-textThe cursor indicates vertical-text that may be selectedPlay it »
w-resizeThe cursor indicates that an edge of a box is to be moved left (west)Play it »
waitThe cursor indicates that the program is busyPlay it »
zoom-inThe cursor indicates that something can be zoomed inPlay it »
zoom-outThe cursor indicates that something can be zoomed outPlay it »
initialSets this property to its default value.Read aboutinitial
inheritInherits this property from its parent element.Read aboutinherit

Related Pages

HTML DOM reference:cursor property



×

Contact Sales

If you want to use W3Schools services as an educational institution, team or enterprise, send us an e-mail:
sales@w3schools.com

Report Error

If you want to report an error, or if you want to make a suggestion, send us an e-mail:
help@w3schools.com

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning.
Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness
of all content. While using W3Schools, you agree to have read and accepted ourterms of use,cookies andprivacy policy.

Copyright 1999-2025 by Refsnes Data. All Rights Reserved.W3Schools is Powered by W3.CSS.


[8]ページ先頭

©2009-2025 Movatter.jp