CSSの記述方法は内部CSSと外部CSSの二通り

アイキャッチ「4色の糸」

HTMLに直接書き込む内部CSSより、CSSファイルを別に用意してそれを読み込む外部CSSの方がコンパクトになってオススメです。
読み込むCSSと画像をチェンジするだけでリニューアルが楽々できますよ!

どちらでも<head>~</head>の間に入れます。

内部CSSで記述する場合(1)head内に記入

<style type="text/css" media="all">
:
ここにCSSの内容を記入
:
</style>

内部CSSで記述する場合(2)直接適用するタグ内に記入

例)テキスト「あいうえお。」の一文の中の「う」の文字色を白に、文字の背景色を赤にする。
あいえお

<p>あい<span style="color: #ffffff;background-color:#ff0000;">う</span>えお。</p>

※デザインを適応したいタグの中に、『 style=”・・・ここにCSS文・・・』を入れる。

CSSファイルを別に用意すし、それを読み込ませる場合

<link rel="stylesheet" href="CSSファイルまでのパス/CSSファイル名" type="text/css" media="all" />

media=”○○”について

閲覧用のメディアですが、基本指定しなくてもOKです。
allの場合は全てのメディアに適応されます。

このメディアを指定することによって閲覧法を変えることで表示されるものが変わられることができます。

よるあるのが画面で閲覧するのと、
プリンターで出力するのでは違う風に表示(または印刷)されてきます。

  • all … すべてのメディア
  • screen … パソコンのスクリーン
  • tty … 文字幅が固定の機器
  • tv … テレビ
  • projection … プロジェクタ
  • handheld … 携帯機器
  • print … プリンタ
  • braille … 点字ディスプレイ
  • speech … 音声出力
  • このエントリーをはてなブックマークに追加

関連記事

ピックアップ記事

  1. アイキャッチ「facebookCG」
  2. アイキャッチ「facebookCG」

アーカイブ

ページ上部へ戻る