menu

セクションの説明(webflow)

webflowを使用してのサイト制作を進めながら学習したことを書いていきます。
今回は「セクション(Section)」について説明します。

セクション(Section)はレイアウトを組んでいく際に
一番最初にベースに100%の幅で配置します。

webflow018-02

セクションの中にコンテナ(Container)を入れることによって、
ブラウザの中央にコンテンツが揃うようになります。

☆セクションの高さアレンジ
デフォルトでのセクションの高さは自動的に広がりますが
高さ設定:minの欄に「100VH」と入力するとサンプルのように
セクションの高さをブラウザ天地100%で設定することができます。
※「50VH」と入力すると天地50%で掲載されます。

webflow018-03

▽サンプル
live-preview

▷Adobe Museでホームページの制作/岸岡デザイン事務所
http://y-kishioka.com

▷Movie Web Magazine/KISHIOKA.DESIGN
http://kishioka.design

webflow017-01フレックスアイテムの設定(webflow)

container_img01コンテナの説明(webflow)

関連記事

  1. filmora036-01

    旅の素敵な動画を飾る28種類のタイトル(後編)(Filmora)…

    旅の素敵な動画を飾る28種類のタイトル(後編)(Filmora) from KISHIOKA.D…

  2. webflow005-01

    Link Blockの使用(webflow)

    サイト制作を進めながら学習したことを書いていきます。今回はの紹介になります。は、写真や文…

  3. photoshop-art006

    古ぼけた写真(Photoshop)

  4. photoshop-gallery001

    Photoshop Gallery 001

  5. webflow003-01

    基本要素の設置(webflow)

    サイト制作を進めながら学習したことを書いていきます。今回は基本要素設置の紹介になります。…

  6. div_block_img01

    Divブロックの説明(webflow)

    webflowを使用してのサイト制作を進めながら学習したことを書いていきます。今回は「Divブロ…

  7. filmora-pho014-01

    トランジション「ベーシック編6(終)」(Filmora)

    トランジション「ベーシック編6(終) 」(Filmora) from yasuo kishiok…

  8. xd008

    自動アニメーションでスライドを動かしてみる(Adobe XD)

    バージョン13.0から搭載された「自動アニメーション」を使って、1コマ目でタップ操作から2〜4コ…

PAGE TOP