👻
HTML,CSSの基本
HTML
ブロック要素
例
div,p,h1~h6,form
特徴
・改行される
・横幅の初期値が親要素と同じ
・横幅と高さの指定が可能
・タグによってデフォルトで余白がつく
インライン要素
例
span,a,img,input
特徴
・改行されない
・横幅は内容で決まる
・横幅と高さの指定はできない
・余白のつき方は特殊
->上下のmarginが付けられない。左右はつく。
・上下のpaddingは、他の要素に被ってしまう。
CSS
セレクタとプロパティ
例
div {
font-size: 16px;
}
↑
セレクタ{
プロパティ: 値;
}
優先順位について
・id > class > タグの順に優先順位が高い
・指定する数が多い方が強い
・例外として!importantが最強になる。(基本は使わないこと)
複数指定や階層構造の指定
# 複数指定はカンマ区切り
.wrapper1 , .wrapper2 {
}
# 階層構造は空白を開ける
.wrapper .contents {
}
display
position
値 | static | relative | absolute | fixed |
---|---|---|---|---|
どんなものか | デフォ値 | 通常の表示位置からの相対位置 | ・親要素からの絶対位置 ・横幅は内容によって決まる |
・画面の位置の固定位置 ・横幅は内容によって決まる |
z-indexについて | 無効 | 有効 | 有効 | 有効 |
Discussion