q1.【 2 】(cascading style sheets)は、h1 { background: blue; } のように書くことで文章を装飾できる。
はじめに
カスケーディングスタイルシート(CSS)は、ウェブページの見た目をデザインするための言語です。CSSを使用することで、HTML要素のスタイルを簡単にカスタマイズできます。例えば、h1 { background: blue; }
のようなスタイルルールを使用することで、見出し要素を装飾することができます。
CSSの基本
CSSでは、スタイルシートを使ってHTML要素のプロパティを指定します。スタイルシートは、以下の方法でHTML文書に適用できます。
- インラインスタイル: HTMLタグの「style」属性を使用
- 内部スタイルシート: HTML文書内の「<style>」タグを使用
- 外部スタイルシート: 外部のCSSファイルをリンクする方法
例: h1 要素のスタイル
以下は、CSSを使ってh1
要素に背景色を指定する例です。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>CSSの例</title>
<style>
h1 {
background: blue;
color: white;
padding: 10px;
text-align: center;
}
</style>
</head>
<body>
<h1>こんにちは、世界!</h1>
</body>
</html>
CSSプロパティの解説
上記の例では、以下のCSSプロパティを使用しています。
プロパティ | 説明 |
---|---|
background | 要素の背景色を設定します。 |
color | テキストの色を設定します。 |
padding | 要素の内側の余白を設定します。 |
text-align | テキストの水平位置を設定します。 |
参考文献
関連するQ&A
Q1: CSSで背景色を変更するにはどうすればよいですか?
A1: CSSでは、background
プロパティを使用して背景色を変更できます。例えば、background: blue;
と指定することで背景色を青にすることができます。
Q2: 内部スタイルシートと外部スタイルシートの違いは何ですか?
A2: 内部スタイルシートはHTML文書内の<style>
タグを使用して定義されますが、外部スタイルシートは別のCSSファイルに定義され、HTML文書に<link>
タグでリンクします。外部スタイルシートを使用すると、複数のHTML文書で同じスタイルを共有できます。
Q3: CSSのpadding
プロパティはどのように機能しますか?
A3: padding
プロパティは、要素の内容とその境界の間に空白(余白)を追加します。padding: 10px;
と指定することで、すべての方向に10ピクセルの余白を追加します。