【CSS08】作業時間はトータルで1時間から1.5時間くらい
課題は→http://d.hatena.ne.jp/web-design-advance/20120507/p1
<!DOCTYPE html> <HTML lang="ja"> <HEAD> <META charset="UTF-8"> <TITLE>【CSS08】石垣島観光ガイド</TITLE> <style type="text/css"> * { margin: 0; padding:0; } body { background-color: #66CCFF; font-size: 0.875em; font-family: sans-serif; line-height:1.5em; } #base { background-color: white; width: 760px; height:auto; padding: 20px; margin: 0 30px; } h1 { font-size: 1.8em; color: #0099CC; margin: 15px 0; } h2 { font-size: 1.5em; color: #0000CC; border-left: 5px solid #3399CC; margin: 15px 0; padding: 5px; } h3 { font-size: 1.2em; color: #000066; background-color: #99FFFF; border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; margin: 3px 0; padding: 5px; } h4 { font-size: 1.0em; text-decoration:strong; color: #66CCFF; margin: 5px 0; } p { color: #000; text-decoration:none; margin-bottom: 3px; } p.h1p { color: #000; text-decoration:none; text-indent: 0.875em; margin-bottom: 3px; } </style> </HEAD> <BODY> <div id="base"> <h1>石垣島観光ガイド</h1> <p class="h1p">石垣島は八重山諸島の中で一番大きな島で、沖縄で3番目に大きな島です。 沖縄からは、空路で約1時間、沖縄より台湾に近く南に位置します。気候は亜熱帯気候で、1年を通じて平均気温は27度もあります。亜熱帯気候のため、 マングローブの森や色とりどりの南国の花が咲き、赤瓦屋根の民家、 そして何よりも、鮮やかなコバルトブルーの海岸は、多くの観光客をひきつけ、 特にダイバーやシュノーケリングを楽しむ人にとっては格好の場所になっています。</p> <h2>観光スポット</h2> <h3>「川平（かびら）湾」</h3> <h4>石垣港から車で約20分</h4> <p>石垣を代表する景勝地で、エメラルド色のサンゴ礁と黒真珠の養殖でよく知られています。 潮の流れが早いため、遊泳は禁止されています。</p> <h3>「宮良川（みやらがわ）のヒルギ林」</h3> <h4>石垣港からバスで30分宮良橋で下車</h4> <p>巨大なマングローブ林（ヒルギ群落）があり、国の天然記念物に指定されているほど壮大です。</p> <h3>「底地（すくじ）ビーチ 」</h3> <h4>川平湾から車で約10分</h4> <p>マリンスポーツが楽しめ、マンタが見られることから、ダイバーに人気があります。</p> <h3>「フサキビーチ」</h3> <h4>石垣港からバスで30分、宮良橋下車</h4> <p>島の西側にあるビーチで、西表（いりおもて）島に沈む美しいサンセットが見られるビーチとして有名です。</p> <h3>「米原海岸」</h3> <h4>石垣空港より車で約30分</h4> <p>米原キャンプ場が隣接していて、ビーチパーティが楽しめます。潮の流れが早いため、遊泳は禁止されています。</p> <h3>「マエザトビーチ」</h3> <h4>石垣空港より車で約5分</h4> <p>ホテル内にあるリゾートビーチですが、宿泊者以外でも利用可能です。ファミリー向けリゾート地で、 シュノーケルのレンタルもあります。</p> <h3>「唐人墓（とうじんばか）」</h3> <h4>石垣空港より富崎観音堂方面へ車で15分</h4> <p>19世紀中頃に、中国のアモイからカリフォルニア行きの船に乗せられて死んでしまった128人の中国の人を悼み、琉球特有のお墓です。</p> <h3>「明石パラワールド」</h3> <h4>石垣市街地より車で45分</h4> <p>島の北方で水牛などの牧場が広がる地域に1997年にできました。素晴らしい景観を見ながら、 パラグライダーを楽しむことができます。</p> </div> </BODY> </HTML>
「#base」でひとくくりにしたエリアをブラウザの中心表示にしたかったが、
どう指定してやればいいか悩んだので（忘れてます、なじんでなくて）、
margin使って少し離した程度の仕上がり。
ここでできなかったから、できるようになると今度は猿のように真ん中にしまくる気がします。
