[ホーム] -> [CSS 実験室]

test-css/csstitle.html

ソース

このソースをダウンロードする。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
 "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1"> 
    <meta http-equiv="Content-Style-Type" content="text/css"> 
    <link rev="made" href="mailto:hizuya@hizlab.net">
    <title>Cascading Style Sheets</title>
    <style type="text/css">
      <!--
      #css1 {
        color: #F0F0F0;
        margin-top: 20px;
        margin-left: 8px;
        font-size: 170px;
        font-style: italic;
        font-family: Impact;
        text-align: center;
      }
      #css2 {
        color: #DDDDFF;
        margin-top: -215px;
        font-size: 170px;
        font-style: italic;
        font-family: Impact;
        text-align: center;
      }
      .main {
        color: #2FB3BA;
        font-size: 48px;
        font-weight: bold;
        font-family: Times New Roman;
      }
      .main1 {
        color: #007F8B;
        margin-top: 0px;
        font-size: 48px;
        font-weight: bold;
        font-family: Times New Roman;
      }
      .main2 {
        color: #007F8B;
        margin-top: 0%;
        font-size: 48px;
        font-weight: bold;
        font-family: Times New Roman;
      }
      #wnew {
        color: #7777FF;
        margin-top: -130px;
        margin-left: 24%;
        font-size: 24px;
        font-weight: bold;
        font-family: Vendana;
        text-align: left;
      }
      #dynamic {
        color: #A300FF;
        margin-top: 100px;
        margin-right: 5%;
        font-size: 24px;
        font-weight: bold;
        font-style: italic;
        font-family: Georgia;
        text-align: right;
      }
      #mes1 {
        color: #A000CC;
        margin-top: 20px;
        margin-right: 20%;
        margin-left: 20%;
        line-height: 140%;
        font-size: 16px;
        font-weight: bold;
        font-style: italic;
        font-family: Comic Sans MS;
        text-align: center;
        text-decoration: underline;
      }
      #mes2 {
        color: #B39CB3;
        margin-top: 5%;
        margin-left: 20%;
        line-height: 120%;
        font-size: 12px;
        font-weight: bold;
        font-style: italic;
        font-family: Georgia;
        text-align: right;
      }
      .center {
        margin-top: -160px;
        text-align: center;
      }
      A:link    {color: #0000FF;}
      A:active  {color: #8CC0FF;}
      A:visited {color: #9000AF;}
      -->
    </style>
    <link rev=MADE href="mailto:hizuya@hizlab.net">
  </head>
  <body style="background: #FFFFFF url(../../images/backtile.gif)">
    <div id="css1">CSS</div>
    <div id="css2">CSS</div>
    <div class="center">
      <span class="main1">C</span><span class="main">ascading</span><br>
      <span class="main2">S</span><span class="main">tyle </span><span class="main2">S</span><span class="main">heets</span>
    </div>
    <div id="wnew">What's new?</div>
    <div id="dynamic">dynamic HTML, dynamic style</div>
    <div id="mes1">
      "Hopefully, future Web innovations will emulate the example set by the Web Consortium in its work on CSS"<br>
      --Jakob Nielsen
    </div>
    <div id="mes2">
      "Stylesheets are just plain good for everybody"<br>
      --Simson Garfinkel, HotWired
    </div>
    <div>
      <!-- CSS href="http://www.w3.org/Style/CSS/" -->
      <img src="../../images/cssos.gif" alt="CSS" width="83" height="31">
    </div>
  </body>
</html>

実行

この HTML を表示する。

戻る