Clear fixを学ぶ
Clearfix
▶ 資料を見る
左右にフロート(回り込み)をした要素の次にくる要素には、「clear:both」回り込み解除の指定が必要です。でなければ、次にくる要素も、再び回り込みをしてしまう特性があるからです。コンテンツ内に、clearを実装しないといけない場面が多々出てくることを予測して、clear_fixというクラスセレクタを事前に用意し、引用するやり方を推奨します。
|
1 2 3 4 5 6 |
.clearfix::after { content:"";/*擬似要素を入れる*/ display:block;/*ブロック要素に仮定*/ clear:both;/*フロートを解除させる*/ } |
練習問題/お題/ケーキハウス
ケーキのコンテンツの背景に、必ず色を流し込みます。左メニューと右コンテンツを同セクションで包囲してください。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
ケーキハウス ショートケーキ モンブラン ザッハトルテ ショートケーキ モンブラン ザッハトルテ 人気のケーキ 日本語で単にケーキというと、一般には、スポンジケーキにクリームを塗り果物を載せたものを指すが、 広義では、チーズケーキやホットケーキなどクリームも果物も載せないものや、 クッキーを砕いた土台の上にクリームチーズの生地を敷き、 冷やして固めたレアチーズケーキなど、様々な種類を指すこともある。 ショートケーキ 日本では、スポンジケーキを土台にして、ホイップクリームをつなぎと外装に、 そしてイチゴを味付けに使ったものを「ストロベリーショートケーキ」といい、 一般にはこれを単に「ショートケーキ」ともいう。 イチゴ以外の食材を使ったものは通常その食材の名を冠して、「バナナショートケーキ」「ピーチショートケーキ」などという。 モンブラン 栗をふんだんに使ったケーキである。山の形に似せて作ったことからこう呼ばれる。 名前の由来は、アルプス山脈のモンブランであり、フランス語で「白い山」を意味する。 フランス語ではケーキはモン・ブラン・オ・マロン（Mont Blanc aux marrons、栗のモンブランの意）と呼ばれる。 尚、上に降りかけられる白い粉砂糖は雪を表している。 山名と同様にイタリアではモンテ・ビアンコ（Monte Bianco）と呼ばれる。 このサイトは、学習教材用のデザインサンプルです。 実在しません。 2012©CAKEDAISUKI Rights Reserved. |
練習問題 vol.02
▶ ケーキ大好き進化系も合わせて練習します。
サンプルをみる
