Use CSS style sheets to immediately change the mouse style

Those who are familiar with Windows will not be unfamiliar with all kinds of mouse styles. When the mouse moves to a different place, when the mouse executes different functions, when the system is in a different state, the shape of the mouse changes. On the web page, there is usually a hand shape only when the mouse is on the hyperlink, and there seems to be no change in other places. This is not harmonious with dynamic web pages. In fact, CSS allows you to easily define many mouse shapes. Using the method described in this article, you can set different mouse styles anywhere on the webpage.
To create a hand-shaped mouse style effect in Dreamweaver3, follow these steps:
1. Press F7 (or click the icon in the "quick start" column like "Gossip") to bring up the CSS panel, select "none", and click the edit icon in the lower part of the panel, in the "Edit Style Sheet" dialog box that appears, press the "New" button and select "Make Custom Style (class)" in the "New Style" dialog box that appears, enter ". cursor1 (that is, give a name to the class to be defined, note that the previous small point should not be missed), Press OK, and "Style Definition. the cursor1 dialog box (as shown in the following figure) defines the ". cursor1.
2. In "Style Definition. select "Extensions" in the selection window on the left of the cursor1 dialog box and define (also select) the "Cursor" attribute on the right panel. In this example, the mouse shape is required to be changed to the hand shape, click the triangle button and select "hand" from the pulled mouse style list, as shown in the figure above.
3. Press the OK button to return to the "Edit Style Sheet" dialog box. Press the "Done" button to complete CSS. The CSS code seen between

The code is as follows:	Copy code
<Style type = "text/css"> "〉 <〈! -- . Cursor1 {cursor: hand} --> --〉 </Style> 〉

For users who are not using Dreamweaver3, directly copying the above code between head and head has the same effect.
4. Select a text or image and click ". cursor1" on the CSS panel. Press F12 and move the mouse to the place where the CSS style of the mouse is changed and the mouse is changed to the hand shape. If you are not using Dreamweaver3, you must add class = "cursor" to the source code of the webpage.
To change the mouse to another shape, just select a different style when defining the "cursor" attribute in step 2. The meaning of each attribute value is as follows:
Crosshair: precise positioning of the "10" font; text: text "I"; wait: wait, "hourglass"; default: default pointer; help: help, with a tail arrow; e-resize: the arrow toward the right; ne-resize: the arrow toward the top right; n-resize: the arrow toward the top; nw-resize: the arrow toward the top left; w-resize: the arrow toward the left; sw-resize: arrow toward the bottom left; s-resize: arrow toward the bottom; se-resize arrow toward the bottom right; auto: Automatic, by default, the mouse changes the style based on the elements on the page.
After understanding the meaning of the above attribute values, the shape of the mouse is in your grasp. You only need to repeat the above operations to make the mouse shape. Note that only one mouse style can be defined at a time. If you use multiple mouse styles on a page, you need to define multiple "classes" and select to load them.