HTML CSS
HTMLマニュアルCSSとは
CSS(Cascading Style Sheets)とはWebページの文字の色や大きさ、背景、配置といったスタイル（見た目）を設定する言語です。CSSの基本を理解しておけば、WebサイトやHTMLメールの簡単なデザイン変更は、自分自身で行うことができるようになります。
HTML のように、CSS は本当のプログラミング言語ではありません。またマークアップ言語でもありません。CSS はスタイルシート言語です。CSS は、HTML の要素を選択的にスタイルにするために使うものです。
例えばCSSでは、以下のようなことを設定することができます。
- 文字の色、サイズ、行間、行揃えなどの指定
- 背景色、背景画像、ボーダー、角丸などの指定
- レイアウト、余白の調整
- アニメーションの記述
CSSの記述場所
①要素にstyle属性を追加して局所的に適用する（インラインスタイル）
②<style>要素で文書単位に適用する（内部スタイルシート）
③<link>要素で外部CSSファイルを呼び出して適用する（外部スタイルシート）
効率の良いスタイル管理を目指す場合には、 CSS部分を外部ファイル化するのが一般的です。
インラインスタイル
インラインスタイルは、単一のHTML要素のみに影響を与えるCSS宣言で、style属性の中に記述します。
背景
<p style="background-color:red;">RED段落</p>
<p style="background-color:green;">GREEN段落</p>RED段落
GREEN段落
テキストのフォント・大きさ・カラー
<p style="font-family:arial;color:red;font-size:25px;">赤い文字</p>赤い文字
文字列の配置
<p style="text-align:center;">中央に寄せる段落</p>中央に寄せる段落
内部スタイルシート
HTML文書の要素内に要素を記述して、文書単位にスタイルシートを設定します。 適用されるスタイルがCSSによるものであることをブラウザなどに知らせるために<style>要素のtype属性の値にはtext/cssを指定する必要があります。
<head>
<style type="text/css">
body {background-color:yellow;}
p {color:blue;}
</style>
</head>外部スタイルシート
複数のページに共通のデザインを適用する場合は、CSSファイルを別に作り、HTMLファイルから読み込みます。これが最も一般的な方法です。
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>外部スタイルシートの読み込みには<link rel="stylesheet" href="ファイル名.css">というコードを使います。このコードをheadタグの中に書きましょう。
HTMLファイルと外部CSSファイルが同じフォルダにある場合はhref=”ファイル名”と書きます。ファイル名のかわりに”ファイルのURL（絶対パス）”を書いてもOKです。
複数の外部CSSを読み込むことはできます。linkタグをもう一つ書けばいいです。
コメント