CSS
   すぐに使えるスタイルシート集。めざせCoolサイト!!
スクロールバーの色を変更する 
テキストリンクの文字色を変更する 

テキストリンクの背景色を変更する

 

背景画像を設定する

 

カーソルを変更する

 


スタイルシートを使うには3種類の方法があります。

  1.外部ファイル(拡張子.css)から読み込む方法
  2.<head>タグ内で定義する方法
  3.タグにスタイルを定義する方法

 
まず、1.外部ファイル(拡張子.css)から読み込む方法とは、htmlとcssを別々のファイルに分けて、リンクさせるということです。

メリットとしては、同じスタイルにさせたいHTMLファイルが大量にある場合、スタイルの記述は、CSSファイル一回で済むのでデータ容量が抑えられます。この時、スタイルを読み込ませたいHTMLファイルの<head>タグ内にその旨を記述しなければならないので、手間が少なくなるかというとそういうわけではないでしょう。


HTML内の<head>タグ内に次の文で定義します。
<link rel="stylesheet" href="スタイルシートのURL" type="text/css">
2.<head>タグ内で定義する方法とは、HTMLファイル1ページごとに違ったスタイルをかけたい場合に使用します。
例えば、「このページのスクロールバーの色は白にしたいんだけど、他のページは青がいいな」なんてときに使います。白いスクロールバーのページは、この方法を使い、他のページの青いスクロールバーは、1の外部ファイルから読み込む方法と使い分けるのがよいでしょう。

HTML文書の<head>タグ内へ次のように記述します。

<style type="text/css">
<!--
a { background-color: orange}
-->
</style>

3.タグにスタイルを定義する方法は、HTMLファイルのこの部分だけスタイルを変えたいという場合に使用します。

例えば、こんな感じをhtmlで表すと、ソースを見てもらえばわかるのですが、(メニューバー/表示→ソース)
<b style="background-color: #ffff66">こんな感じ</b>
という記述になっています。

そうです。
太文字の<b>タグについている
style="background-color: #ffff66"
がスタイルですね。
はっきり言って、これはタグ一つ一つに記入していかなければならないので、かなり面倒な作業になります。
ここぞというときにだけ使いましょう。

タグ内へ直接書き込みます。
<b style="background-color: #ffff66">
<span style="font-size: 26pt">サンプル</span>
などなど。
これらの3種類のCSSを巧みに使ってCoolなサイトを作りましょう!

さらに詳しく知りたい人は 【スタイルシート辞典第3版】

TOP

特選!オススメブック
【ホームページ辞典第3版】
【スタイルシート辞典第3版】
【今日から始めるホームページWebデザイン】
Web制作・
Webクリエイター 
- All About
[Webプロデュース]
JPORT
レンタルサーバー

大容量ホスティングサービスの決定版!
(C) Copyright 2003. Web Square
このページはWEB SQUAREのフレーム内の一つです。
サーチエンジンなどから直接本ページに飛んでこられた方はエントランスページhttp://web_square.tripod.co.jp/へどうぞ。

[PR]三井住友海上きらめき生命:医療保険のご案内と資料請求はこちらから