1月の授業日記

12月の授業日記  >home

12/16 CSS(スタイルシート)

CSS(スタイルシート)とは

CSSの基本書式

プロパティ:値

様々な表示に関する設定(プロパティ)を指定できる

CSSを記述する場所

CSSはHTMLとは記述方法が違うのでうまくHTMLのなかに取り込む必要がある

1.タグの中に直接記述する(インラインスタイルシート)

style属性の属性値として記述することでそのタグ内をスタイル指定できる

<タグ style="プロパティ:値">

対象はタグ内のみ

2.タグから独立して指定する(埋め込みスタイルシート)

セレクタ

タグから切り離す場合、何に対しての指定かが判るように対象をセレクタで表す

セレクタ{プロパティ:値;}

セレクタをタグにするとタグの見栄えを自分で指定できる

タグから切り離す際の記述場所

background-color:

body以外の様々な要素にも背景色がつけられる

きょうのひとこと

よいお年を!

1/20 CSS2外部スタイルシート

CSSによる背景画像

CSSの背景画像は様々な場所に指定でき、さらに複雑な指定も行える

background-image:url(背景画像へのパス)

下記の方法で背景画像のリピート方法も指定できる

背景画像のリピート方法の指定

background-repeat:no-repeat,repeat-x,repeat-y

繰り返さない、横一列、縦一列が指定可能

3.外部スタイルシート

外部CSSファイル
html側からのリンク方法
ヘッダ内にlinkタグでCSSファイルへのパスを記述する

<link href="CSSファイルへのパス" rel="stylesheet" type="text/css">

きょうのひとこと

あけましておめでとうございます。今年もよろしく!

1/27 CSS3 クラス/IDセレクタ

CSSによる罫線

border:プロパティで様々な個所に様々な様式で罫線をつけられる

border:形状 色 太さ

一つのプロパティに複数の値をつける場合、それぞれを半角スペースで区切る(順不同)

class/IDセレクタ

タグのclass/ID属性

タグに名前を付けて識別できる

<タグ class="クラス名">(何度か出現する場合)

<タグ ID="ID名">(一度きりしか出現しない場合)

class/IDセレクタの指定方法

(タグ).class名{プロパティ:値}

(タグ)#ID名{プロパティ:値}

タグと関係なくスタイル指定を行いたい場合、タグをつけずにclass/ID名のみをセレクタにできる

表示効果のないタグ

div,spanタグを用いればタグの表示効果と切り離して指定できる

<div>〜</div>

改行のみ入る=ブロック単位の指定に用いる

<span>〜</span>

改行も入らない=段落内の一部の指定に用いる

きょうのひとこと

試験頑張ってください!