写这篇博客前不得不先吐槽下国内的技术性文章现状;

1:在国内真心缺少技术性的文章;

2:用百度搜技术性的文章真心不靠谱;

好吧;正题;下面是在国外搜刮来的;比较齐全的鼠标手型css;在国内的网站上是搜不到这么全的;比如说哪个禁止的手型;

鼠标往下移动即可看到效果;


html代码如下:<h2>Cursors</h2><divclass="cursors"><divclass="auto">auto</div><divclass="default">default</div><divclass="none">none</div><divclass="context-menu">context-menu</div><divclass="help">help</div><divclass="pointer">pointer</div><divclass="progress">progress</div><divclass="wait">wait</div><divclass="cell">cell</div><divclass="crosshair">crosshair</div><divclass="text">text</div><divclass="vertical-text">vertical-text</div><divclass="alias">alias</div><divclass="copy">copy</div><divclass="move">move</div><divclass="no-drop">no-drop</div><divclass="not-allowed">not-allowed</div><divclass="all-scroll">all-scroll</div><divclass="col-resize">col-resize</div><divclass="row-resize">row-resize</div><divclass="n-resize">n-resize</div><divclass="s-resize">s-resize</div><divclass="e-resize">e-resize</div><divclass="w-resize">w-resize</div><divclass="ns-resize">ns-resize</div><divclass="ew-resize">ew-resize</div><divclass="ne-resize">ne-resize</div><divclass="nw-resize">nw-resize</div><divclass="se-resize">se-resize</div><divclass="sw-resize">sw-resize</div><divclass="nesw-resize">nesw-resize</div><divclass="nwse-resize">nwse-resize</div></div>

css代码如下:

@import"compass/css3";.auto{cursor:auto;}.deafult{cursor:default;}.none{cursor:none;}.context-menu{cursor:context-menu;}.help{cursor:help;}.pointer{cursor:pointer;}.progress{cursor:progress;}.wait{cursor:wait;}.cell{cursor:cell;}.crosshair{cursor:crosshair;}.text{cursor:text;}.vertical-text{cursor:vertical-text;}.alias{cursor:alias;}.copy{cursor:copy;}.move{cursor:move;}.no-drop{cursor:no-drop;}.not-allowed{cursor:not-allowed;}.all-scroll{cursor:all-scroll;}.col-resize{cursor:col-resize;}.row-resize{cursor:row-resize;}.n-resize{cursor:n-resize;}.e-resize{cursor:e-resize;}.s-resize{cursor:s-resize;}.w-resize{cursor:w-resize;}.ns-resize{cursor:ns-resize;}.ew-resize{cursor:ew-resize;}.ne-resize{cursor:ne-resize;}.nw-resize{cursor:nw-resize;}.se-resize{cursor:se-resize;}.sw-resize{cursor:sw-resize;}.nesw-resize{cursor:nesw-resize;}.nwse-resize{cursor:nwse-resize;}.cursors>div{float:left;box-sizing:border-box;width:20%;padding:10px2px;text-align:center;white-space:nowrap;&:nth-child(even){background:#eee;}&:hover{opacity:0.25}}