CSS cursor property example-CSS Tutorial-php.cn

CSS cursor property example

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Release： 2023-09-10 14:53:02

forward

1306 people have browsed it

CSS 光标属性示例

With CSS cursor properties, you can display crosshairs or plus signs, pointers, and more. You can try running the following code to implement the cursor property in CSS -

Example

<html>
   <head>
   </head>
   <body>
      <div style = "cursor:auto">Auto</div>
      <div style = "cursor:crosshair">Crosshair</div>
      <div style = "cursor:default">Default</div>
      <div style = "cursor:pointer">Pointer</div>
      <div style = "cursor:move">Move</div>
      <div style = "cursor:e-resize">e-resize</div>
      <div style = "cursor:ne-resize">ne-resize</div>
      <div style = "cursor:nw-resize">nw-resize</div>
      <div style = "cursor:n-resize">n-resize</div>
      <div style = "cursor:se-resize">se-resize</div>
      <div style = "cursor:sw-resize">sw-resize</div>
      <div style = "cursor:s-resize">s-resize</div>
      <div style = "cursor:w-resize">w-resize</div>
      <div style = "cursor:text">text</div>
      <div style = "cursor:wait">wait</div>
      <div style = "cursor:help">help</div>
   </body>
</html>

Copy after login

We have added the following values above-

##autoThe shape of the cursor depends on ends in the context area in which it is located. For example, "I" on text, "hand" on link, etc. CrosshairCrosshair or plus signDefaultArrowPointerA pointing hand (in IE 4 this value is the hand). Move"I" columne-resizeThe edge of the cursor indication box will Move to the right (east). ne-resizeThe edge of the cursor indication box will move up and to the right (North/East). nw-resizen-resizeThe cursor indicates that the edge of the box is to be moved up (north). se-resizeThe cursor moves the edge of the indicated box down and to the right (south/east). sw-resizeThe cursor moves the edge of the box down and to the left (south/west). s-resizeThe edge of the cursor indication box moves downward (south)).w-resizeThe edge of the cursor indication box moves to the left (west)).TextI column. WaitingAn hourglass. HelpQuestion mark or balloon, perfect for use on the help button. Cursor image file source.

Value	Description







The edge of the cursor indication box will move up and to the left (North/West).

The above is the detailed content of CSS cursor property example. For more information, please follow other related articles on the PHP Chinese website!