webpagemaker https://blog.hatena.ne.jp/webpagemaker/ 96's blog https://96s.hatenablog.com/ PhotoShop ボタン作成 シェイプツールでボタン作成 スタイルはダウンロード→ 220 Amazing Free Photoshop Layer Styles 文字ツールで文字間調整。カーニングをメトリクスに。 ボタンのレイヤーと文字のレイヤーをパレット右上のメニューからグループ化し、複製。 各グループの絵を移動させ、適宜項目名・グループ名を変える。 イメージ→切り抜きでアートボードを画像の大きさにしてから、Web用で保存。 テクニック 選択範囲をalt＋方向キーで移動コピー。さらに＋shiftで10px移動。 レイヤー内サムネイルでctrl＋クリックでオブジェクト選択。 複数レイヤーのオブジェクト選択する… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2F96s.hatenablog.com%2Fentry%2F20130724%2F1374591600" title="PhotoShop04（CSS Spriteボタン作成） - 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-24 00:00:00 rich https://96s.hatenablog.com/entry/20130724/1374591600 1.0 100%