Tablet View
SP View
appeal_010
画像と文字を左右に並べる時の画像を２枚にしたバリエーション
Living room
吾輩は猫である。名前はまだ無い。
どこで生れたかとんと見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。吾輩はここで始めて人間というものを見た。
詳細はこちら
Living room
吾輩は猫である。名前はまだ無い。
どこで生れたかとんと見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。吾輩はここで始めて人間というものを見た。
詳細はこちら
- 左右違いブロックの指定で、右にある画像を「表示順：偶数カラムを上段に」の設定にすることでスマホでは上に表示させています。
- 左右違いブロックを利用しているため、カラム比率の変更はスライダーで調整可能です。
- 画像は横長と若干の縦長画像の２枚を配置していますが、それぞれ独立した画像になっています。レスポンシブに対応するため２枚の画像間の余白も含め横幅を％指定しています。高さを揃えるために画像サイズは下記にしていただくことをオススメします。
横長：718px × 533px 縦長：487px × 533px - 背景黒として作成していますが、CSSで設定している文字色とリンクデザインの色を変更することで白背景などでも利用できます。