× 無料のユーザー登録をすると学習状況を管理することができるようになります

実践!ウェブサイトを作ろう (全16回)

実践的なレイアウト手法を学んだのちに、実際に架空のウェブサイトを作ってみます。

#01 実践的なレイアウト手法を学ぼう
1351日前
動画中で紹介されているCSS resetのサイトはこちらです。
http://yuilibrary.com/yui/docs/cssreset/
#06 3カラムのレイアウト (固定幅)
1342日前
どうしても #center のコンテンツを #left より先に記述したい場合には、例えば #center と #left をさらにもう1つの div 要素に入れて、その div 要素を 1 つのカラムとみなした 2 カラムのレイアウトとすることでうまくいきます。(実際のCSSはどうなるか考えてみましょう。)

<!-- #main_wrapper と #rightで2カラムレイアウト -->
<div id="main_wrapper">
    <!-- #center と #left で2カラムレイアウト -->
    <div id="center">center</div>
    <div id="left">left</div>
</div>
<div id="right">right</div>
#09 背景を設定しよう
266日前
動画中(1:13〜)の説明ですが、CSSでheight: 100%を使うには親要素の高さも考慮しなくてはいけないため、さまざま要素にheightプロパティを設定する必要があります。
このあたりの手順の詳細については以下のサイトでも解説されておりますので参考にしてみてください。

・CSSで高さ(height)100%のボックス要素を作る方法 | BlackFlag
http://black-flag.net/css/20110621-3232.html
266日前
こちらで利用している背景画像ですが以下のURLで表示したあとに保存するなどしてご利用ください。
http://dotinstall.com/img/grey.png