→HTML関連
→Web技術関連
用語 †
- 置換要素 replaced element:要素の内容がドキュメントの内容では直接表せないものと置き換えられる要素。コンテンツがない。例)img, input
- 非置換要素 nonreplaced element:要素自体が表示されるもの。例)span
- ブロックレベル要素:親要素のコンテンツエリアを埋める要素。要素ボックスの前後に改行を生成する。例)p, div
- インラインレベル要素:行の流れを分断することなく、テキスト行に要素ボックスを生成する。要素ボックスの前後に改行を生成しない。例)a, strong, em
一般記事 †
入門サイト †
ブラウザ対応 †
Bootstrap †
Tips/サンプル †
Flexbox †
ブラウザスタイルの初期化 †
- 参照:http://code.nanigac.com/source/view/134
*{
margin: 0;
padding: 0;
background-color: transparent;
color: black;
font-size: medium;
font-family: Verdana, Arial, "ヒラギノ角ゴ Pro W3", "Osaka", "MS P ゴシック", san-serif;
}
セレクタの種類 †
- 疑似クラスセレクタ
a:visited すでに訪れたことのあるリンク
- その他、:hover, :focus, :active など
- 子孫セレクタ
A B {} Aタグの中のBタグの要素に適用
- 擬似要素 セレクタの最後に付ける
- :first-letter
- :first-line
- :before
- :after
セレクタの詳細度(specificity) †
- 複数のセレクタ指定で同じ要素に複数のスタイル指定が競合した場合は、セレクタの詳細度が最も詳細なスタイルが適用される。
- 詳細度の高さは ID > クラス、属性選択、疑似クラス > 要素 (p.66)
コンビネータ †
- 子コンビネータ child combinator: 子供の要素を指定 例)h1 > strong{}
- 隣接コンビネータadjacent-sibling combinator: 兄弟の要素を指定 例)h1+p {}
プロパティの種類 †
- 基本書式=<名前>:<値>;
- margin:0;
- color:#fff;
- background:#fff;
- display:none; //ある要素を表示させたくないとき
- margin, border, padding, height, width の関係
コメント †
|