段組みのCSS。

2018/01/09 392 users CSS いにしえ プロパティ 従来 シチュエーションごと

ページレイアウトに段組みはつきもの。Webデザインでは、CSSで段組みを行います。ちょっと前までは“よこ並び”も“段組み”もfloatプロパティひとつでまかなってました。けれど今は、シチュエーションごとにいろんなプロパティが用意されて、うまく使い分けることで、より効率よくページレイアウトができるようになってきました。そんなわけでここでは「段組みするためのCSS」を、従来（いにしえ）の方法から最新（... 続きを読む

知っておいてよかった！Web制作時に効率上げる「便利」なCSSテクニック | コムテブログ

2014/07/14 553 users CSSテクニック コムテブログ Web制作時 マルチカラム

少し前にサイト制作でさりげなく使われているCSSテクニックをまとめましたが、今回はそれを補足する形で、これから増えそうなもの、使っていきたいものを今後忘れないようにメモしておきます。 もくじ 画像 １．ブレンドモード ２．表示範囲 ３．透過＋合成 ４．半透明 エフェクト ５．マウスオーバーアイデア一覧 ６．CSSのみでメニューアイコン 段組み ７．マルチカラム ８．段の表示順 ９．コンテンツ流し込... 続きを読む

CSS 3における新しいレイアウト手法：ボックスレイアウト - builder by ZDNet Japan

2008/11/13 209 users builder by ZDNet Japan CSS 3

今回は、floatプロパティとボックスレイアウトを利用した段組みを比較していく。また、CSS 3で段組みのレイアウトを実現する「Multi Column」との違いも確認する。 ウェブページのレイアウトでは、ヘッダーやサイドバー、コンテンツなどをどのように配置するかがポイントとなる。現在、配置のコントロールにはfloatやpositionプロパティを利用するのが一般的だが、CSS 3の「Advanc... 続きを読む

HTML をシンプルに保ちつつ、ブロック要素の段組みを実現する方法 パート2 | バシャログ。

2008/07/18 277 users バシャログ position float HTML 余白

「HTML をシンプルに保ったままブロック要素を段組みする方法」のパート 2 です。 前回の記事では、float と position の合わせ技により、全体の横幅ピッタリに要素を段組みしました。 今回は、position を使わない方法をご紹介します。 ボックスと余白の幅の値は前回と同じく以下です。 HTML ソースも前回と同じくこちら。無駄な ID や class のないシンプルなソースになっ... 続きを読む