|
■ スタイルシートの取り込み方
インライン スタイルシート
インラインスタイルシートは、style 属性を使いタグに直接スタイルシートを取り込みます。
<span style="font-size:16px;color:#ff60cc">文字のサイズと色を指定</span>
文字のサイズと色を指定
<div style="border:1px solid #ff60cc;padding:5px">ボーダーとパディングを指定</div>
ボーダーとパディングを指定
エンベッデイング スタイルシート
エンベッデイング スタイルシートは、<head> 内に <style> タグを用いて実装します。
<style type="text/css"><!--
body {
font-size:14px;
color:#00000;}
td {
font-size:13px;
color:#555555;}
--></style>
上の場合は、body の文字は14pxのサイズで色は黒。テーブルの文字は13pxのサイズで色はグレーになるスタイルシートです。
リンキング スタイルシート
リンキング スタイルシートは、スタイルシートをHTML内に書き込まず外部ファイルとして作り、
それを <link> タグを用いてHTMLに取り込みます。この方法は複数のHTMLファイルに使えるのでとても便利です。
複数の同じデザインページがある場合に特に向いています。
body {
font-size:14px;
color:#00000;}
td {
font-size:13px;
color:#555555;}
上のようにテキストエディタで書いたものを、拡張子を css にして保存します。 名前.css
そのファイルを <head> に書いたリンクタグでHTMLに取り込みます。
<link rel="stylesheet" type="text/css" href="名前.css">
|
