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-imgage:url(背景画像へのパス)

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

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

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

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

3.外部スタイルシート

外部CSSファイル
  • htmlから独立してCSSだけを記述する専用ファイル＝拡張子.css
  • htmlではないのでタグは必要なく直接CSSを記述できる
    • html側からのリンク方法
    ヘッダ内にlinkタグでCSSファイルへのパスを記述する

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

    今日のひとこと

    今日の授業は簡単そうで意外と難しかった...

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

    CSSによる罫線

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

    border:形状 色 太さ

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

    class/IDセレクタ

    タグのclass/ID属性

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

    ＜タグ class="クラス名"＞（何度か出現する場合）

    ＜タグ ID="ID名"＞（一度きりしか出現しない場合）

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

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

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

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

    表示効果のないタグ

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

    ＜div＞〜＜/div＞

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

    ＜span＞〜＜/span＞

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

    今日のひとこと

    難しくてよくわからない。