ホームページ更新 その15(カーソル変更)
カーソルをオリジナルの画像に変更しました。
カーソルの画像の用意
カーソルの画像はIllustratorで作成しました。
ドーナツ状に穴を開けるには複合パスを使いますが、うまくいかなかったので、パスファインダーで分割して穴を開けました。
背景が透明になるようにpng形式で書き出します。
Tips
オブジェクトを隠す:command + 3
隠したオブジェクトを表示:command + option + 3
アウトライン表示:command + y
アートボードサイズを選択オブジェクトに合わせる:オブジェクトメニュー、アードボード、選択オブジェクトに合わせる
CSSの修正
style.cssに
html { cursor: url(../img/risu32.png), auto; }
を追加します。
「../img/risu32.png」部分はカーソル画像のパスとファイル名です。
上記で、html全体をオリジナルのカーソルにするので、文字部分は通常のカーソルになるように
h1, h2, h3, h4, h5, h6, p { cursor: auto; }
とします。
SAInoLESSON(サイのレッスン) Macの使い方講座、詳しい情報はこちら。