Home >Web Front-end >CSS Tutorial >Can CSS mouse styles be customized? (Examples of multiple styles)

Can CSS mouse styles be customized? (Examples of multiple styles)

藏色散人
藏色散人Original
2018-08-15 15:23:411956browse

This article mainly introduces to you a summary of relevant knowledge about CSS custom mouse styles on the page. Hope it helps friends in need.

Then let me give you a specific code example:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>css cursor样式自定义</title>
</head>
<body>
<a href="#" style="cursor:pointer">css pointer 拖拽形状效果</a><br/><br/>
<a href="#" style="cursor:auto">CSS鼠标cursor样式之由系统自动给出效果</a><br/><br/>
<a href="#" style="cursor:crosshair">CSS鼠标cursor样式之十字型效果</a><br/><br/>
 <a href="#" style="cursor:text">CSS鼠标cursor样式之I字形效果</a><br/><br/>
<a href="#" style="cursor:wait">CSS鼠标cursor样式之等待效果</a><br/><br/>
 <a href="#" style="cursor:default">CSS鼠标cursor样式之默认效果</a><br/><br/>
 <a href="#" style="cursor:ne-resize">CSS鼠标cursor样式之向右上箭头效果</a><br/><br/>
<a href="#" style="cursor:s-resize">CSS鼠标按下样式效果</a><br/><br/>
<a href="#" style="cursor:w-resize">CSS鼠标cursor样式之向左箭头效果</a><br/><br/>
<a href="#" style="cursor:e-resize">CSS鼠标cursor样式之向右的箭头效果</a><br/><br/>
</body>
</html>

The above code can be directly copied and pasted for local testing. The effect is as follows:

Can CSS mouse styles be customized? (Examples of multiple styles)

Then the above is an introduction to the different effects of css mouse cursor style. I hope it will be helpful to friends in need.


The above is the detailed content of Can CSS mouse styles be customized? (Examples of multiple styles). For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn