Home > Web Front-end > HTML Tutorial > css各种手型集合(css禁止手型)_html/css_WEB-ITnose

css各种手型集合(css禁止手型)_html/css_WEB-ITnose

WBOY
Release: 2016-06-21 08:54:35
Original
1738 people have browsed it

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

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

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

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

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


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

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: 10px 2px;   text-align: center;     white-space: nowrap;   &:nth-child(even) {      background: #eee;        }   &:hover {      opacity: 0.25   }}
Copy after login


source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template