スタイルシートの適用
＜＜ 前のページ エントリーを表示する
スタイルシートで見た目をよくします。(※スタイルシートのネタ帳参照)
スタイルシートを全て覚えるのは大変ですが、実際に使用するスタイルは以外に少ないものです。もちろん凝ったデザインを作成するためには、多くのスタイルを学習する必要がありますが、少ないスタイルでも見た目がよいデザインは作ることができます。実際にやってみましょう。
まずは、メインページのテンプレートに1行追加します。
スタイルシートが定義されているファイルを読み込むための1行です。
<head>と</head>の間に以下の1行（太字）を追加します。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" />
<title><$MTBlogName$></title>
<link rel="stylesheet" href="<$MTBlogURL$>styles-site.css" type="text/css" />
</head>
<body>
<h1><$MTBlogName$></h1>
<h2><$MTBlogDescription$></h2>
<MTEntries lastn="5">
<h3><$MTEntryTitle$></h3>
<$MTEntryBody$>
</MTEntries>
</body>
</html>
<$MTBlogURL$>は、サイト(ブログ)トップページのURLを出力します。
再構築して作成されたHTMLは、以下のようになります。（当サンプルの場合です。）
<link rel="stylesheet" href="http://mt.lt-ac.com/sample/styles-site.css" type="text/css" />
スタイルシートが定義されているファイルの名称は、MovableTypeのテンプレート→スタイルシートで表示される画面で編集することが可能です。（下図参照）
メインページのテンプレートの時と同じように、初期状態で記述されているスタイルシートのソースを全て削除します。（バックアップを忘れずにお願いいたします。）
※スタイルシートの場所を変更したい場合
上記のように、
<link rel="stylesheet" href="<$MTBlogURL$>styles-site.css" type="text/css" />
と記述すると、サイトのトップにスタイルシートを置くことになります。
スタイルシート用のフォルダ(フォルダ名はstyleとします)を作成して、その中に入れたい場合は、
<link rel="stylesheet" href="<$MTBlogURL$>/style/styles-site.css" type="text/css" />
とテンプレート上に記述し、上図の赤線の部分は『/style/styles-site.css』とします。
次のページ ＞＞ グループ化する