レスポンシブの仕様について

ferret Oneで作成したWebサイトはレスポンシブデザインに対応しており、閲覧するデバイス（PC・タブレット端末・スマートフォン）のディスプレイ幅によりデザインが可変します。
閲覧するデバイスのディスプレイ幅が770px以上の場合、PC向けのレイアウトで表示され、770px未満の場合はタブレット・スマホ向けのレイアウトとなります。
ここでは作成したWebサイトのレイアウトがどのように自動調整されるかをご説明します。


エリアのレスポンシブ

エリアのご説明はこちら

各エリアはディスプレイ幅770px以上のデバイス（主にPC）から閲覧した場合は上記画像のように表示されますが、ディスプレイ幅770px未満のデバイス（主にタブレット・スマホ）から閲覧した場合は下記画像のように可変します。


スマホ閲覧時はパンくずリストが非表示となります。


ボックス（セクション・行・カラム）のレスポンシブ


緑色の枠はセクション、青色の枠は行、黄色の枠はカラム、赤色の枠はパーツとなります。
（詳細はこちら）
位置を識別するためにパーツには番号を振っています。

各ボックスはディスプレイ幅770px以上のデバイス（主にPC）から閲覧した場合は上記画像のように表示されますが、ディスプレイ幅770px未満のデバイス（主にタブレット・スマホ）から閲覧した場合は下記画像のように可変します。


セクション・行の上下の位置関係は変わりませんが、カラムが左から順に縦表示されます。