menu

基本要素の設置(webflow)

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

◎Layout/[Section]をドラッグして、ナビゲーションの下に配置する。
・[Section]を選択した状態で、Selector:に任意の名称を設定する。

webflow003-02
webflow003-03

◎Layout/[Container]を[Section]の中に配置する。

webflow003-04
webflow003-05

◎Layout/[Columns]を[Container]の中に配置する。

webflow003-06
webflow003-07
webflow003-08

◎[Container]や[Columns]の配置位置などを調整します。

webflow003-09
webflow003-10

◎この作業をワンセットとしてコンテンツの制作を行い、
積んでいく形でレイアウトを進めています。

▽サンプル
live-preview

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

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

audio-visualizer-set01音楽とマウスでビジュアルを操作(Adobe Muse CC)

webflow004-01Div Blockの使用(webflow)

関連記事

  1. keynote-animation01

    インとアウトのアニメーション(Keynote Animation…

    【Keynote】をプレゼンテーション用としての利用以外に、ネット上などで掲載をするための動画作…

  2. columns_img01

    カラムの説明(webflow)

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

  3. xd008

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

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

  4. photoshop-art005

    Photoshop Art 005

  5. okakishi-chaya_img01

    架空のサイトを制作開始(webflow)

    前回まで、制作方法を紹介するようなページを掲載してきましたが中々、これが飽いてきまして(笑)、や…

  6. filmora037-01

    旅の素敵な動画を飾る10種類のトランジション(Filmora)

    旅の素敵な動画を飾る10種類のトランジション(Filmora) from KISHIOKA.DE…

  7. filmora-pho024-03

    ビューティーコレクション/オーバーレイ9種(Filmora)

    ビューティーコレクション/オーバーレイ9種(Filmora); from yasuo kishi…

  8. okakishi-chaya_img05

    中面3ページにインタラクションとライトボックスを設定(webfl…

    架空サイト【岡岸茶屋】に「お店の紹介」「甘味メニュー」「おみやげ」ページを作成。お店の紹介ページ…

PAGE TOP