CSSでよく使うタグまとめ　職業訓練56日目

CSSファイルについて

CSSファイルとはHTMLで使ったstyleをHTMLとは別のファイルで用意しとき必要な時に持ってくるということができます。文書の要素構成はHTMLで作成し、スタイリングはCSSで作成することができます。そうすることで、HTMLの<header>部分がスッキリしてとても見やすくなります。

----------------------------------------------------------------------------

(CSS)

p{color: red;} →<p>の文字を赤に

（HTML)

<link rel="stylesheet" type="text/css" href="cssファイル名";>

↑の文を入力することでCSSファイルをHTMLに適用することができます。上記の場合は<p>の部分の文字が赤くなるというものです。イメージはできましたか？

またlinkの文を複数使えば、複数のCSSファイルを使用できます。Javaのインポートの概念がよく似ています。

代表的なCSSタグ

・文字の装飾

color  文字の色の指定

font-family 文字フォントの指定

font-style 文字を斜体にする時に使用

font-weight 太字にする時に使用

font-size フォントサイズを指定

・テキストの配置

text-align 左寄せ（left）右寄せ（right）中央（center）

text-indent テキスト１行目のインデント指定

letter-spacing 文字と文字の間隔の指定

word-spacing 単語と単語の間隔の指定

・背景

background-color 背景色の指定

background-image 背景に画像の貼り付け

background-position 背景画像の位置の指定

background-repeat 背景画像繰り返すかどうかの指定

・ブロックのサイズ

width 表やテキスト入力欄、画像などの表示領域の横幅の指定

height 表やテキスト入力欄、画像などの表示領域の高さの指定

・余白

margin ボックスの外側の余白の設定

padding ボックスの内側の余白の設定

・罫線

border-color 罫線の色の指定

border-style 罫線の種別の指定。solid：一本線、double:二本線、dashed:破線

border-width 罫線の幅の指定

・テーブル

table-layout テーブルのレイアウトの指定。デフォルトでは各列の幅が自動で設定される。

border-collapse テーブルの罫線を引く際、隣同士のセルをくっつけるかどうかの指定。collapseつながり、separate分離。

border-spacing セル同士の間隔の指定。

他にもたくさんありますが今日はこの辺で失礼します。ありがとうございました。