ホームページ >ウェブフロントエンド >CSSチュートリアル >CSS を使用してカスタム カーソル スタイルを使用して竜巻を実装する例

CSS を使用してカスタム カーソル スタイルを使用して竜巻を実装する例

高洛峰
高洛峰オリジナル
2017-03-04 10:00:431571ブラウズ

テスト環境はChromeブラウザです

Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.132 Safari/537.36

css風

p
{
  cursor:url('1.jpg'),pointer;
}
HTML
<body>
  <p style="width:100px;height:100px;background-color:red;"></p>
</body>

pにマウスを置くと、カーソル 指定したパターンに変わります

*注意事項

カスタマイズした画像が十分小さいことを確認してください。ここでの画像は16*16です

ブラウザごとに異なる画像形式がサポートされています。ご自身で見つけてください

cursor:url ( '1.jpg'), pointer; ここの 1.jpg は現在の html ファイルと同じディレクトリにある必要があります。これはカスタムピクチャが適用できない場合のバックアップ計画です。このテストでは。

カスタム カーソル スタイルを使用した上記の CSS の実装_Escape Tornado は、エディターによって共有されたすべてのコンテンツです。参考にしていただければ幸いです。また、PHP 中国語 Web サイトをサポートしていただければ幸いです。

カスタム カーソル スタイルを使用して竜巻を実装する例に関するその他の関連記事については、PHP 中国語 Web サイトに注目してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。