2004/06/21時点のスタイル

　◆ページのヘッダ

<div class="main">

<div class="logo"></div>

<hatena name="calendar" delimiter="◇">

　◆ページのフッタ

    <!-- hatena info -->

    <table border="0" width="540">

    <tr valign="top">

        <td><hatena name="hoturl" listlimit="10"></td>

        <td><hatena name="hotkeyword" listlimit="10"></td>

    </tr></table>

</div>

<div class="sidebar">

<!-- calender -->

    <div class="title">◇カレンダー</div>

    <hatena name="calendar2">

<!--   icon   -->

    <div class="icon">    

    <a href="http://a.hatena.ne.jp/append?http://d.hatena.ne.jp/panda728/"><img src="http://a.hatena.ne.jp/images/append.gif" border="0" title="アンテナに追加"></a>

    <a href="http://d.hatena.ne.jp/keyword/%a4%cf%a4%c6%a4%ca%a5%c0%a5%a4%a5%a2%a5%ea%a1%bc%a5%ac%a5%a4%a5%c9"><img src="http://d.hatena.ne.jp/dav/guide/images/d.gif" border="0" title="はてなダイアリーガイド"></a>

    <a href="http://d.hatena.ne.jp/panda728/rss"><img src="http://d.hatena.ne.jp/dav/images/icon/rss_m.gif" border="0" title="はてなダイアリーのRSSファイル"></a>

    </div>

<!-- group -->

    <div class="title">

    ◇はてなグループ

    </div>

    <li><a href="http://battlegear.g.hatena.ne.jp/panda728/">トルネード走法研究会</a>

<!-- selection -->

    <div class="title">

    ◇よりぬきログ

    </div>

    <li><a href="http://d.hatena.ne.jp/panda728/20040620#1087731208">伏見桃山大会</a>

<!--  category   -->

    <div class="title">

    ◇カテゴリ

    </div>

    <li>[<a href="http://d.hatena.ne.jp/panda728/searchdiary?word=%2a%5bbg3%5d">バトルギア3</a>]

    <li>[<a href="http://d.hatena.ne.jp/panda728/searchdiary?word=%2a%5breplay%5d">リプレイ</a>]

    <li>[<a href="http://d.hatena.ne.jp/panda728/searchdiary?word=%2a%5btop%5d">トップ画像</a>]

    <li>[<a href="http://d.hatena.ne.jp/panda728/searchdiary?word=%2a%5bcss%5d">CSS</a>]

<!--  title   -->

    <hatena name="section" listlimit="10" titlelength="8" moduletitle="最近の見出し" showcategory="false" template="list">

<!--  course  -->

    <div class="title">

    ◇コースマップ(ネコサダさん作成)

    </div>

    <table border="0" cellpadding="0" cellspacing="0" class="map">

    <tr>

        <td>◆<a href="http://members.jcom.home.ne.jp/mokona/bg/map07.htm" target="map">超初級</a></td>

        <td><li><strike> 超初級B</strike></td>

    </tr>

    <tr>

        <td>◆<a href="http://members.jcom.home.ne.jp/mokona/bg/map01.htm" target="map">初級</a></td>

        <td>◆<a href="http://members.jcom.home.ne.jp/mokona/bg/map10.htm" target="map">初級B</a></td>

    </tr>

    <tr>

        <td>◆<a href="http://members.jcom.home.ne.jp/mokona/bg/map02.htm" target="map">中級</a></td>

        <td>◆<a href="http://members.jcom.home.ne.jp/mokona/bg/map09.htm" target="map">中級B</a></td>

    </tr>

    <tr>

        <td>◆<a href="http://members.jcom.home.ne.jp/mokona/bg/map03.htm" target="map">上級</a></td>

        <td>◆<a href="http://members.jcom.home.ne.jp/mokona/bg/map12.htm" target="map">上級B</a></td>

    </tr>

    <tr>

        <td>◆<a href="http://members.jcom.home.ne.jp/mokona/bg/map04.htm" target="map">超上級</a></td>

        <td>◆<a href="http://members.jcom.home.ne.jp/mokona/bg/map13.htm" target="map">超上級B</a></td>

    </tr>

    <tr>

        <td>◆<a href="http://members.jcom.home.ne.jp/mokona/bg/map05.htm" target="map">弩級</a></td>

        <td>◆<a href="http://members.jcom.home.ne.jp/mokona/bg/map08.htm" target="map">弩級B</a></td>

    </tr>

    <tr>

        <td>◆<a href="http://members.jcom.home.ne.jp/mokona/bg/map06.htm" target="map">超弩級</a></td>

        <td>◆<a href="http://members.jcom.home.ne.jp/mokona/bg/map11.htm" target="map">超弩級B</a></td>

    </tr>

    </table>

<!-- counter -->

    <div class="title">

    ◇はてなカウンター<br><hatena name="counter">Hits<div class="px10" align="right">(since 2004.04.15)</div>

    </div>

<!-- anntena -->

    <div class="title">

    ◇はてなアンテナ

    </div>

    <li><a href="http://a.hatena.ne.jp/panda728/simple?gid=91704">panda728のアンテナ</a>

<!-- about -->

    <div class="title">

    ◇about

    </div>

    <div class="px12">

    「なにわのパンダ」こと「なにぱん」のバトルギア３な日記。<br>

    <a href="panda-728@oct.zaq.ne.jp">mail</a>

    </div>

</div>

<div class="footer"><img src="http://www.oct.zaq.ne.jp/afadz200/footer.png" border="0"></div>

　◆スタイルシート

textarea{ width: 800px; height: 350px; }

table {

    width : 694px ;

}
table table {

    width : 100% ;

}
table table td {

    vertical-align : top;

    padding : top;

}

body{

    background-image: url("http://www.oct.zaq.ne.jp/afadz200/back.png");

    background-attachment: fixed;

    background-repeat: repeat-y;

    background-color: #fff;

    text-align: left;

    margin: 0px 0px 0px 96px;

}

div.logo{

    background-image: url("http://www.oct.zaq.ne.jp/afadz200/logo9.png");

    background-repeat: no-repeat;

    background-color: transparent;

    border-left: 1px solid #000;

    border-right: 1px solid #000;

    text-align: center;

    height: 80px;

    margin: 0px 0px 0px 0px;

    padding: 2px 2px 2px 2px;

}
table.calendar{

    width : 140px;

    background-color: transparent;

    border-top: 1px solid #000;

    border-left: 1px solid #000;

    border-right: 1px solid #000;

    border-bottom: 1px solid #000;

    font-size: 90%;

    text-align: left;

    margin: 0px 0px 0px 0px;

    padding: 2px 2px 2px 2px;

}

table.calendar a{

    width:100%;

} 

.main .calendar{

    margin: 0px 0px 0px 0px;

    font-size: 90%;

}

div.sidebar{

    font-size: 80%;

    color: #000;

    text-align: left;

    position: absolute;

    top: 60px;

    left: 645px;

    width: 145px;

    padding: 0px 0px 0px 0px;

}

div.icon{

    margin: 0px 0px 0px 0px;

    padding: 2px 2px 2px 2px;

}

h1{

    display: none;

    border-bottom: 1px dotted #000;

    color: #000;

    text-align: left;

    margin: 0px 0px 0px 0px;

    padding: 0px 0px 0px 0px;

}

div.main{

    margin: 0px 0px 0px 4px;

    width: 540px;

}

div.day{

    background-image: url("");

    background-repeat: no-repeat;

    background-color: transparent;

    font-size: 100%;

    color: #000;

    text-align: left;

    margin: 0px 0px 0px 0px;

    padding: 0px 0px 0px 0px;

}

div.body{

    border: 1px;

    border-color: #60E8A0;

    border-style: dashed ;

    margin: 0px 0px 0px 0px;

    padding: 0px 0px 0px 0px;

}

h2{

    background-color: transparent;

    font-size: 100%;

    font-weight: normal;

    text-align: left;

    margin: 10px 0px 0px 0px;

    padding: 2px 2px 2px 2px;

}

h3{

    background-image: url("http://www.oct.zaq.ne.jp/afadz200/line.jpg");

    background-repeat: repeat-y;

    background-color: transparent;

    border-top: 1px solid #000;

    border-bottom: 1px solid #000;

    font-size: 90%;

    font-weight: normal;

    text-align: left;

    margin: 0px 0px 0px 0px;

    padding: 4px 4px 4px 4px;

}

h3 span.sanchor{} /*【■】*/

h3 span.timestamp{

    font-weight: normal;

    font-size: 90%;

}

div.section{

    margin: 0px 0px 0px 0px;

}

div.section p{

    font-size: 100%;

    line-height: 115%;

    margin: 10px 10px 10px 10px;

}

div.title{

    font-size: 80%;

    background-image: url("http://www.oct.zaq.ne.jp/afadz200/line.jpg");

    background-repeat: repeat-y;

    border-top: 3px double #000;

    border-bottom: 1px dotted #000;

    margin: 4px 0px 4px 0px;

    padding: 2px 0px 2px 0px;

}

p.recentitem{

    font-size: 80%;

    background-image: url("http://www.oct.zaq.ne.jp/afadz200/line.jpg");

    background-repeat: repeat-y;

    background-color: transparent;

    border-top: 3px double #000;

    border-bottom: 1px dotted #000;

    margin: 0px 0px 0px 0px;

    padding: 0px 0px 0px 0px;

}

div.recentsubtitles{

    font-size: 80%;

    background-color: transparent;

    margin: 0px 0px 0px 0px;

    padding: 0px 0px 0px 0px;

}

img.photo{

    background-image: url("");

    background-repeat: no-repeat;

    background-color: transparent;

    border: 2px solid #333;

    float: right;

    margin: 10px 10px 10px 10px;

    padding: 0px 0px 0px 0px;

}

img.hatena_photo   { border: 0px; }

ul.hatena_photo    { margin: 1em; padding: 0; }

ul.hatena_photo li { 

    display: inline;

    margin: 1px;

    padding: 0;

    list-style-type: none;

}

ul.hatena_photo li a:hover, 

ul.hatena_photo li a:focus{

    position: relative;

    top: 1px;

    left: 1px;

    background-color: transparent;

    color: transparent;

}

ul{ margin: 10px 10px 10px 30px; }

dl{ margin: 10px 10px 10px 30px; }

ol{ margin: 10px 10px 10px 30px; }

a         { text-decoration:none; }

a:link    { color: #2D41A4; }

a:visited { color: #3B9690; }

a:hover   { color: #52E84A; background-color: #D4FED3; }

a.keyword{

    color:#000;

    border-bottom: 1px solid #00ff00;

}

ins{

    border-bottom: 3px double #E8BCE2;

    text-decoration: none;

    padding: 0px 0px 0px 0px;

}

ins:after{

    content: "("attr(datetime)")";

}

del{

    border-bottom: 3px double #99D3E8;

    padding: 0px 0px 0px 0px;

}

del:after{

    content: "("attr(datetime)")";

}

q{

    border-bottom: 3px double #E8A076;

    text-decoration: none;

    padding: 0px 4px 0px 4px;

}

div.body blockquote{

    background-color: #E7F5FE;

    border-top: 3px double #999;

    border-bottom: 3px double #999;

    font-size: 90%;

    text-align: left;

    margin: 10px 10px 10px 10px;

    padding: 10px 10px 10px 10px;

}

div.body blockquote p{

    color: #555;

    font-size: 90%;

    margin: 0px 0px 0px 0px;

}

pre{

    background-color: #FFE6EE;

    border-top: 3px double #999;

    border-bottom: 3px double #999;

    margin: 5px 10px 5px 10px;

    padding: 4px 4px 4px 4px;

}

div.footnote{

    font-size: 80%;

    color: #000;

    text-align: left;

    margin: 10px 10px 10px 10px;

    padding: 0px 0px 0px 0px;

}

div.footnote p{

    background-color: #eee;

    border-top: 1px dotted #000;

    border-bottom: 1px dotted #000;

    margin: 6px 0px 6px 0px;

}

div.caption{

    background-image: url("");

    background-repeat: repeat-y;

    background-color: transparent;

    font-size: 80%;

    text-align: right;

    margin: 0px 0px 0px 0px;

    padding: 2px 2px 2px 2px;

}

div.commentshort{

    background-color: transparent;

    border-left: 1px solid #000;

    font-size: 100%;

    color: #000;

    border: 1px;

    border-color: #60E8A0;

    border-style: dashed ;

    text-align: left;

    padding: 0px 0px 0px 0px;

    margin: 10px 10px 10px 10px;

}

div.commentshort p{

    background-color: #ccc;

    border-top: 1px solid #ccffcc;

    border-bottom: 1px solid #ccffcc;

    text-align: left;

    margin: 4px 4px 4px 4px;

}

span.commentator{

    text-decoration: underline;

}

span.highlight{

    background-color:#5EEEFE;

    color: black;

}

div.footer{

    clear: both;

    margin: 0px;

}

.ranktitle { 

    font-size: 10px; 

    font-weight: bold;

    text-align: left;

    color: #fff; 

    background: #333333;

    line-height: 95%;

    text-indent: 5px;

}

.rankbtn{ 

    font-size: 9px; 

    background-color:#ff8000;

    width:10px;

    height:10px;

}

.map{

    width : 140px;

    background-color: transparent;

    font-size: 90%;

    text-align: left;

    margin: 0px 0px 0px 0px;

    padding: 2px 2px 2px 2px;

}

.px10 { font-size: 10px; line-height: 110%; }

.px12 { font-size: 12px; line-height: 110%; }

.px14 { font-size: 14px; line-height: 110%; }

.px18 { font-size: 18px; line-height: 110%; }