skillup

技術ブログ

デザイン

CSSのレイアウト例 その3 固定+リキッドレイアウト

投稿日:

本日は固定レイアウト+リキッドレイアウトについて。

リキッドレイアウトとはブラウザの幅に合わせて表示を変える方法でして、スマホが一般的となった現在では非常によく使われています。

今回解説するのは例えばサイトバーなどは固定で、メインのカラムがリキッドレイアウトのケースです。

例によってサイトが具体的にどうなっているかを知りたい方は「プロとして恥ずかしくない 新・CSSデザインの大原則」を買いましょう。

基本的な構成はこのエントリーで紹介したカラムレイアウトと同じです。

 

-デザイン
-,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

CSSで背景画像の出力

最近はやりのWEBデザインでよくある、大きな背景画像のなかにユーザー名とパスワードを入力させるような画面の作成方法について。

基本的な …

no image

CSSのブロックとインライン、レイアウトについて

今回はCSSを組む時のブロックレベルとインラインの基本とレイアウトに関して。 Contents1 ブロックレベルとインライン1.1 ブロックレベル要素1.2 インライン要素2 レイアウトに関して2.1 …

no image

Bootstrapまとめ form+画像

前回に引き続きbootstrapネタについて。 Contents1 フォーム1.1 通常のinput1.2 項目名:入力欄の形式1.3 入力欄+ボタン(検索などでよくあるパターン)2 画像2.1 参考 …

no image

positionを使うときに注意すること

positionを使ったときに色々なまとめ。 親>子>孫だったときに親がrelative、子、孫がabsoluteだと孫の基準点は子になる(ソース参照) position:absolute …

no image

compassについて

sassをベースにしたフレームワークがcompassです。 Contents1 compassとは?2 使用方法3 参考リンク compassとは? sassの記法をベースにCSSファイルの作成が可能 …