ホームページ > ウェブフロントエンド > CSSチュートリアル > CSSカーソルURLの使用形式を詳しく解説

CSSカーソルURLの使用形式を詳しく解説

高洛峰
リリース: 2016-10-09 13:36:48
オリジナル
2290 人が閲覧しました

CSS カーソル URL 使用形式: css:{cursor:url('icon path'),auto;} //IE、FF、Chrome ブラウザはすべて利用可能

サンプルコード: html{cursor: url("http:// ued.taabao.com/blog/wp-content/themes/taabaoued/images/cursor.ico"),auto;}

分析: 前の URL はカスタム マウス アイコン パスで、2 番目のパラメーター auto は CSS 標準です。カーソルのスタイルは他の属性 (ポインター/デフォルトなど) に置き換えることができます。
(注: w3school では、URL で定義された使用可能なカーソルがバックアップとして使用できる場合に備えて、2 番目のパラメーターで共通のカーソルを定義する必要があることをお勧めします。また、IE では 2 番目のパラメーターを省略できます)

マウスをカスタマイズする表示アイコン、必須 次の問題に注意してください

アイコン形式:

IE は cur、ani、ico 形式をサポートします。FF は bmp、gif、jpg、cur、ico 形式をサポートします。ani 形式や gif はサポートしません。アニメーション形式なので、一般的には、URL で参照される画像を ico または cur 形式で保存することをお勧めします。


アイコンのサイズ:

マウス画像の推奨サイズは32*32です。それ以外の場合、アイコンのサイズが不一致になる可能性があります。


また、マウス画像がブラウザに表示されない問題については、主にマウス画像の URL パスへの参照に問題があるため、絶対パス参照と相対パス参照をそれぞれ試すことができます。

最後に、カーソル属性の可能な値が添付されます: (すべての主要なブラウザは次のカーソル属性をサポートしています)

CSSカーソルURLの使用形式を詳しく解説

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート