#6.5｜CSSで要素を重ねて表示する
⚠️ preproからのお願い
このチャンネルは「修行の場」です。「コピペは原則禁止」。
自分の指でコードを打ち込み、エラーと向き合い、身体で技術を身につけていく。
一見タイパが悪いように見えて、それがジェネラリストへの一番の近道です！
〜デザインからプログラミングまで一人で開発できるジェネラリストへ〜
ICTの技術をトータルで学ぶYouTubeチャンネル「prepro -プリプロ-」へようこそ！
講師の東郷です。
今回の番外編はCSSの強力な武器position: absolute;について徹底解説します。
Webサイトを作っていると「どうしてもこの要素をここに重ねたい！」「親要素を基準に右下に配置したい！」という場面が出てきます。
そんな時に役立つのがpositionプロパティです。
少しクセがありますが、マスターすればレイアウトの幅がぐっと広がります。
今回学ぶ「絶対値」と「相対値」の概念を理解して、Webデザインの必殺技を手に入れましょう！
【この動画で学べること】
- 要素を「絶対座標」で指定して重ねる方法（position: absolute;）
- コーディングルールとは？ ・効率的にスタイルを管理するCSSの書き方
- 基準点のコントロール（relativeを使った親要素を基準にするテクニック）
- top: 50%とtransformを使った黄金の配置法（上下左右中央配置）
【preproのカリキュラム方針】
preproでは、特定の言語に特化せず、Webアプリ開発の全体像を学びたい方をターゲットにしています。
本編： 15分でサクサク進むメイン講義
0.5回シリーズ： 習熟度の格差を埋め、しっかり学びたい人のための深掘り講義
この「レベル別階層構造」で、初心者から経験者まで自分のペースで学習を進めることができます。