3. CSS基礎
CSSとはHTMLの文字色や背景色等といったスタイルを設定するためのものです。
CSSは Cascading Style Sheetの略で、Cascading(階段状に連続する滝)とあるように、親要素で設定されたスタイルが子要素、孫要素へと引き継がれて適用されます。
スタイルはHTMLのタグに直接設定する事もできますが、HTMLは本来、文章構造を記述するための言語なので、スタイルは別で定義する方が望ましいです。
また、ページが複数存在し、それぞれ共通のスタイルを設定したい場合には、同じスタイルを何度も記述する事になってしまいます。
それらの理由から、スタイルはCSSファイル内で定義し、HTMLはそのCSSファイルを読み込むだけの状態が望ましいです。
CSSの記述方法は以下です。
セレクタ {
プロパティ: 設定値;
プロパティ: 設定値;
プロパティ: 設定値;
}
セレクタとはスタイルを設定する要素を指定するものです。
/* すべてのh1タグに文字色redを設定する */
h1 {
color: red;
}
/* idがtopPageHeaderのタグにフォントサイズ30pxを設定する */
#topPageHeader {
font-size: 30px;
}
/* classにblueBackが指定されたタグすべてに背景色blueを設定する */
.blueBack {
background-color: blue;
}
/* divの子要素のpに太字を設定する */
div p {
font-weight: bold;
}
/* divとpに下線を設定する */
div, p {
text-decoration: underline;
}
このようにタグ名とid、classを使って設定する事もできます。
This software includes the work that is distributed in the Apache License 2.0
最終更新日時: 2018年 10月 25日(木曜日) 12:46