様々な定義はCSSファイルにおいて定義する。一方,HTML文書には
 必要最小なことだけ書くため,フォントの詳細は消えてスタイルの内容
 (a)-(c) ごとの項目ごとに整然として見える。

 /* style23.css: Neatly padding by 10px in each direction */
 @charset "utf-8";
 font { font-family: serif, sans-serif; }
 span.font-style { font-style: italic; }

 /* ページの表題 */
 div.headline {
   text-align:center; position:absolute;
   top:0px; left:0px;
   width:900px; height:50px;
   background-color: green;
   font-size: 30px; color: #ffffff;
   padding: 10px;}

 /* (a) html文書入り口のスタイル */
 div.container {
   text-align:left; position:absolute;
   top:70px; left:0px;
   width:900px;height:100px;
   background-color:#00cc00;color:#333333;
   font-size:medium;line-height:1.2;
   padding: 10px; }

 /* (b) 本文のスタイル */
 div.main {
   text-align:left; position:absolute;
   top:200px; left:0px;
   width:640px;height:300px;
   background-color:#ffff00; color:#000000;
   font-size:x-large; line-height:1.2;
   padding: 10px; }

 /* (c) メニュー部分のスタイル */
 div.menu {
   position:absolute; top:200px;left:660px;
   width:240px;height:300px;
   background-color:#ffe9e9;font-size:12pt; line-height:1.2;
   padding: 10px;}
 Go back to HTML5


CSSファイルの書き方