htmlHow to change the shape of the mouse: 1. Use the cursor attribute of CSS to change the shape of the mouse pointer, code such as ".a{ cursor:hand }"; 2. Use third-party controls to change the shape of the mouse pointer.
The operating environment of this article: Windows7 system, HTML5&&CSS3 version, Dell G3 computer.
CSS/HTML Change the shape of the mouse pointer
There are two ways to change the shape of the mouse pointer; the first one: use the css cursor attribute to change the shape of the mouse pointer. The other is: using third-party controls, and the one I use most often is the first: usingcss style sheetto change themouse pointershape
Let's look at the first one first: use the cursor attribute to change themouse pointershape.
Sometimes we don’t need text or pictures to add links, and we also want the mouse style when adding links. This uses ourcss style sheettomouse pointershape. Please set some properties of the following css mouse pointercss style sheet:
The above is thecss style sheetthat changes themouse pointershape. How to apply it? Let's use an example to illustrate:
欢迎您到XXX来做客
You can also write the style sheet directly in the p tag, and the effect is the same. For example:
欢迎您到XXX来做客
There is another way of using it. The principle is: use A cursor attribute of CSS2, cursor: url (url), mouse files can use various file formats such as jpg, gif, ani and cur. It should be noted that this method can only be displayed normally in IE5.5 or above browsers.
[Recommended learning:HTML video tutorial]
The second method to change the shape of the mouse pointer: the method of using third-party controls
This The method is very simple. You only need to add the following code to the
After modification, the browser will pop up a " Security Settings Warning", click "Yes", the system automatically installs the control, and the mouse can be displayed according to your needs.
So, how to choose the mouse style you need? First log on to the website http://www.cometzone.com. This website has more than 4,000 types of mice in 14 major categories. The content is very extensive, and the mouse files are also beautifully produced. You can select the mouse you need from the categories according to your needs and click on the corresponding mouse. You can preview different effects by clicking on the mouse picture.
After selecting the mouse, click the "GET CURSOR CODE" link in the left navigation of the web page, go to the next page, and then click the "Select Code" button. The content in the multi-line text box under the button is the code I provided above. Only the TheCometCursor('cd_electric',0,626) part of the code is different, and the displayed mouse status is also different.
Default |
default |
Text/Edit |
text |
Auto |
##auto |
pointer, hand (hand is exclusive to IE) | |
move | |
not-allowed | |
no-drop | |
wait | |
help | |
crosshair | |
n-resize | |
s_resize has the same effect as n-resize | |
w-resize | |
e-resize has the same effect as w-resize | |
nw-resize | |
sw-resize | |
ne-resize Same effect as sw-resize | |
se-resize and nw- The effect of resize is the same | |
##url('cursor address') | of the web page file: |
The above is the detailed content of How to change mouse shape in html. For more information, please follow other related articles on the PHP Chinese website!