メインコンテンツにスキップ

端末毎の各レイヤの調整方法

レスポンシブデザインにおける端末毎のレイヤ調整方法について説明します

Takeda avatar
対応者:Takeda
一週間前以上前にアップデートされました

dpdp では、端末毎にレイヤのサイズや位置等を変更することが可能です。

レスポンシブデザインを完成させるために忘れてはいけない、大切な作業です。

以下に、端末毎の具体的なレイヤ設定の方法をご紹介します。

1)まず、目的の端末に合わせて作業画面を選択しておきます。

(下図の例はタブレット用の作業画面です)

2)調整したいレイヤを選択する。

① タブレット端末向けに調整したいレイヤを選択する。

② プロパティパネル内、位置パネルの右端にあるタブレットアイコンをクリックする。

3)位置パネル全体が赤枠で囲まれたら、レイヤの位置を調整する。

* 赤枠で囲まれたエリア内で設定された数値は、その端末のみで有効です。

(下図のケースでは、赤枠内の数値はタブレット表示時のみ有効となり、デスクトップとスマートフォンではこの設定は無視されます)

4)端末アイコンが表示されている設定項目はすべて端末別設定が可能。

* 端末別にレイヤを表示したり、非表示にすることも可能です。

5)テキストレイヤもフォント/サイズ/スタイル等、端末別に調整可能です。

6)よくある失敗

各設定パネルの端末アイコンをクリックして項目全体が赤枠で囲まれる前に設定を変更すると、その他の端末の設定もまとめて変更されてしまいますのでご注意ください。

7)まとめ

作業画面の設定パネルで、端末アイコンが表示されている項目はすべて端末別に表示を変えることができます。また、端末別設定の作業に慣れるまでは上記「7)よくある失敗」をやりがちなので、手順に慣れるまではご注意ください。

こちらの回答で解決しましたか?