XHTML/CSS・トップ | CSS基礎知識・目次

●style属性を使ってCSSを指定する

 HTML(XHTML)文書にCSSを反映させる方法として、外部からCSSファイルを取り込む方法と<head>〜</head>の間にCSSをインクルードしたstyle要素を使う方法がありますが、それ以外にHTMLの特定の要素にstyle属性を配置し、CSSを指定することもできます。(指定した要素しか反映されませんが)

■サンプル↓

サンプル1

サンプル2

【HTML(XHTML)】↓

<h3 style="color: #afffff; font-size: 1.3em; font-style: italic; font-family: 'MS P明朝',serif;">サンプル1</h3>

<p style="color: #ff00ff; font-size: 20px; font-style: italic">サンプル2</p>

 複数指定するときは上のようにセミコロン( ; )で区切って指定します。style属性を使うとHTML(XHTML)文書のソースをスマートにすることや1度に複数のスタイルを反映させるなどのスタイルシートの長所を活用することができませんが、XHTML Basic以外のDTDおよびほとんどの要素に対して使えます。style属性を使うときは<head>〜</head>の間に基準スタイルシート言語としてCSSをページに使うという意味で次のようなmeta要素を配置します。省略することも可能ですが、指定するのが正式です。(※作成ソフトの設定によっては自動的に付加させることも可能です。)

【HTML】↓

<meta http-equiv="Content-Style-Type" content="text/css">

【XHTML】↓

<meta http-equiv="Content-Style-Type" content="text/css" />

【注:】↓

 style="font-family: "MS P明朝";"のように、二重引用符(")の中に二重引用符を入れるとエラーとなります。避ける方法として、一重引用符を使うと良いでしょう。一番最後のセミコロン( ; )は付けても省略しても構いません。

※XHML1.1でstyle属性は推奨されません。また、XHTML Basicではstyle属性および、style要素は使えません。

【参考】↓

<meta http-equiv="content-script-type" content="text/javascript">

<meta http-equiv="content-script-type" content="text/javascript" />

XHTML/CSS・目次 | CSS基礎知識・目次

Copyright (C) 2006-2008 http://www.xml.vc/