webpagemaker https://blog.hatena.ne.jp/webpagemaker/ 96's blog https://96s.hatenablog.com/ Illustrator CSS Sprite（横並び）で表示するボタンを作成 アンチエイリアスを避けるためピクセルプレビューをチェック。 四角、グラデーション（薄い色で）、文字で一組作る。 選択ツールをダブルクリックで横に距離指定してコピー。繰り返し。 文字を適宜変えたらa:linkの状態が完成。 距離指定のコピーで下にもう１段追加。 グラデーションの方向を逆にして、色付きのバーをつけたらa:hoverの状態も完成。 「webおよびデバイス用に保存」の画像サイズタブで「アートボードサイズでクリップ」のチェックをはずし、JPEG・高画質で保存。 不明点 今回は幅160pxのボタンを5つ並べて800pxのサイズにしたかっ… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2F96s.hatenablog.com%2Fentry%2F20130723%2F1374505200_1" title="Illustrator07（ボタン作成） - 96&#39;s blog" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> Hatena Blog https://hatena.blog 2013-07-23 00:00:00 rich https://96s.hatenablog.com/entry/20130723/1374505200_1 1.0 100%