CSS まとめ01
Webページにスタイルシートを貼り付ける方法
インライン方式
実際の HTMLの要素に直接 style属性を使って設定
エンベッド方式
head要素の中に style要素を使って埋め込み外部リンク方式(リンキング方式)
別途スタイルシートだけを記述した文書を作成
list-style-type
リストの先頭に表示するマーカー文字の種類を指定。
list-style-type: none; マーカーなし list-style-type: disc; 黒丸 list-style-type: circle; 白丸 list-style-type: square; 黒四角
text-decoration
テキストに下線・上線・打ち消し線を付けたり、点滅させる。
(点滅はIE・Safari・Google Chrome対応していない。)
同時に複数の値を指定する場合には、値を任意の順序でスペースで区切って記述。
none 何もなし。初期値 underline テキストに下線 overline テキストに上線 line-through テキストに打ち消し線 blink テキストが点滅
text-align
文字の行揃えの位置や、均等割付を指定する
left左寄せにします。
right 右寄せ center 中央揃え justify 均等割付
border-bottom
下ボーダーのスタイル・太さ・色を指定。
スタイル・太さ・色のうち、指定する値を任意の順序でスペースで区切って記述。
none ボーダーなし。重なり合う場合は他の値が優先。初期値。 hidden ボーダーなし。重なり合う場合はhiddenの値が優先。 solid 1本線 double 2本線 groove 立体的に窪んだ線 ridge 立体的に隆起した線 inset 上と左のボーダーが暗く、下と右のボーダーが明るく表示。囲まれた領域全体が立体的に窪んで表示。(上下左右の一部だけに指定しても立体感は出ない。) outset 上と左のボーダーが明るく、下と右のボーダーが暗く表示。ボーダーで囲まれた領域全体が立体的に隆起したように表示。上下左右の一部だけに指定しても立体感は出ない。 dashed 破線で表示。 dotted 点線で表示。
font-family
sans-serif ゴシック系のフォント serif 明朝系のフォント cursive 筆記体・草書体のフォント fantasy 装飾的なフォント monospace 等幅フォント
画像の読み込み方法
<img src=”画像ファイルまでのパス” /> ・CSSでの読み込み(CSSファイル内) background-image:url(“画像ファイルまでのパス”); ・CSSでの読み込み(CSSファイル内) background:url(“画像ファイルまでのパス”); ・CSSでの読み込み(htmlタグ内に直接CSS指定)
overflow・・・・・はみ出た内容の表示方法を指定する
visible
ボックスからはみ出して表示されます。これが初期値です。尚、Internet Explorerでは、内容がはみ出すのではなく、ボックスの方が内容に合わせて拡張されます。
scroll
入りきらない内容はスクロールして見られるようになります。
hidden
はみ出た部分は表示されません。
auto
ブラウザに依存します(一般的にはスクロールして見られるようになります)。