menu

Divブロックの説明(webflow)

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

Divブロックは、サイト構築の際に使用する最も基本的で汎用性の高い要素です。
セクション、コンテナ、ボタンはすべて、特定のプロパティを持つDivブロックです。
サンプルでは、配置したDivブロックの幅を50%(PC以外は70%)に設定。ベースに白を引いて半調に。
その中に文章と写真を配置。ラインはDivブロックを高さ1pxで表現。

div_block_img02

▽サンプル
live-preview

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

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

columns_img01カラムの説明(webflow)

transitions_img01トランジションの設定(webflow)

関連記事

  1. filmora-pho028-01

    8つのカメラシェイクエフェクト(Filmora)

    〜Filmoraで動画編集〜8つのカメラシェイクエフェクト(Filmora) from yasu…

  2. filmora-008

    レンズフレアの効果を試してみよう!(Filmora9)

    Filmora9で動画編集!!エフェクト/レンズフレアを使うと映像に12パターンの光源映り込みを…

  3. filmora-pho020-01

    教育コレクション/トランジション13種(Filmora)

    教育コレクション/トランジション13種(Filmora); from yasuo kishiok…

  4. filmora-pho021-01

    教育コレクション/オーバーレイ5種(Filmora)

    教育コレクション/オーバーレイ5種(Filmora); from yasuo kishioka …

  5. filmora-pho029-01

    Filmoraで動画編集〜スピードコントロール(Filmora)…

    Filmoraで動画編集〜スピードコントロール(Filmora) from yasuo kish…

  6. webflow018-01

    セクションの説明(webflow)

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

  7. filmora-pho006-01

    テキスト「エンディング編」(Filmora)

    テキスト「エンディング編」(Filmora); from yasuo kishioka on V…

  8. photoshop-art005

    Photoshop Art 005

PAGE TOP