整列と配置
複数の要素を並べてそろえ、間隔を均等に整えます。ひとつにまとめて一緒に動かしたり、色・フォント・サイズを一度に変えたりできます。
目分量でそろえると、微妙にずれて見えます。複数をまとめて選んで数値でそろえると、ぐっときれいになります。
- どうやってまとめて選びますか? 編集画面の何もないところからドラッグすると、その中に入ったものが全部選ばれます。
- 何ができますか? 整列・間隔の均等配分・複数の一括変更です。
複数をまとめて選ぶには
Shiftを押しながらクリックすると、1つずつ追加されます。- 何もないところからマウスをドラッグして四角を描くと、その中に入ったものがすべて選ばれます。
⌘Aで全部選び、Escで解除します。
整列して、間隔を均等に配分する
整列で、どちらにそろえるかを選びます- 横 ㅣ 左・中央・右
- 縦 ㅣ 上・中央・下
- 1つだけ選んだときはページを基準に、複数選んだときは選んだもの同士でそろいます。
間隔を均等に配分します- [横/縦の間隔を均等配分] ㅣ 両端はそのままに、間を同じ幅に分けます。3つ以上のときに使えます。
- [カスタム間隔配分] ㅣ 間隔を数値で直接指定します。0 ~ 200 の範囲で入力できます。
複数を一度に変えるには
複数を選ぶと、左パネルの下に複数選択の一括変更が表示されます。確認画面なしですぐに変わり、気に入らなければ⌘Zで戻せます。
| 項目 | 何を変えますか | いつ変わりますか |
|---|---|---|
カラー | 使われている色を選んで、一度に別の色に | 色を選んだ瞬間 |
テキスト | フォントとサイズをまとめて | Enterを押すか、別の場所をクリックしたとき |
画像 | 選んだ写真を別の写真に | 写真を選んだ瞬間 |
サイズ一括変更 | 幅・高さを同じサイズに | Enterを押すか、別の場所をクリックしたとき |
備考
写真と文字を混ぜて選んでも大丈夫です。 当てはまるものにだけ適用されます。2つを一緒に選んで色を変えると、文字の色だけ変わって写真はそのままです。サイズは両方変わります。
前後の順番を変えたり、固定したりするには
重ねて置いたとき、どれが上に来るかを決める操作です。
1つずつ前後に動かしたり、最前面・最背面へ送ったりするのは、左の画面の順序から、またはショートカットでできます。全体のリストはショートカットにあります。
背景写真のように、うっかり触ってはいけないものはロックしておきましょう。 ロックしたものは、クリックしても選ばれません。レイヤーからも解除できます。
| こんな場合 | こうなります |
|---|---|
| グループ全体をロックしたとき | 中身まで、すべてロックされます。 |
| グループの中の一部だけをロックしたとき | グループごと動かしたり、サイズを変えたりはできます。 色を一度に変えるような、中身に触れる操作はできません。 |
| ロックされたものが入ったグループを解除するとき | 解除はできます。ロックはそのまま残ります。 |
少しだけ動かしたり、見た目をコピーしたりするには
- 矢印キーを押すと1ピクセルずつ、
Shiftと一緒に押すと10ピクセルずつ動きます。ほんの少しずれたときに使ってください。 左右反転·上下反転で反転できます。⌘⌥Cでスタイルをコピー、⌘⌥Vでスタイルを貼り付け — 色や枠線を、別のものにそのまま写せます。 詳しくはスタイルのコピーをご覧ください。
押したら開くリンクを付けるには
写真や文字にウェブのアドレスを設定しておくと、プレビューとhtmlファイルで押して移動できます。 付け方と例はリンクにあります。
警告
jpg・pngの画像ファイルで保存すると、リンクは押せません。 画像は文字どおり、ただの絵だからです。押せるようにするには、成果物ダウンロードでhtmlとして保存してください。
複数をひとつにまとめて間隔を自動でそろえる方法はグループとオートレイアウトにあります。