aery0

このデザインについて

retla サンプル
カテゴリー:シンプルベーステーマ:hatenaヘッダー:白(太)
登録日:2006/12/22更新日:2006/12/27利用数:126
シンプルデザインを追求してみました。
aeryのデザインでは残していたはてなのヘッダーや「おとなりアンテナ・おすすめアンテナ」も全て消し、ヘッダーメニューだけ別にして付け加えました。新たに付け加えたヘッダーメニューは、firefoxなら閲覧領域固定で上部に、IEならページ最下部にあります。

ヘッダ/フッタ/スタイルシート

ページのヘッダ

<h1><hatena name="title"></h1>

ページのフッタ

<div class="amenu">
<a href="/retla/">アンテナ</a><a href="/retla/simple">シンプル</a><a href="/retla/detail">詳細</a><a href="/retla/image">画像</a><a href="/retla/edit">管理</a><a href="/retla/logout">ログアウト</a><a href="http://hatenaantenna.g.hatena.ne.jp/">ヘルプ</a>
</div>

スタイルシート

.hatena-body {
  margin-top: 0px;
  margin-bottom:2em;
  padding: 0px;
  background-color: #FFFFFF;
  font-family: Verdana;
  position:relative;
}

table {
 display:none;
}

a {
  color:#00f;
  text-decoration:none;
  font-size: normal;
}
a:hover {
  color: #66f;
}

h1 {
  text-align: left;
  font-size: 16pt;
  font-weight: bold;
  border-bottom: 1px dotted #ADB2FF;
  margin-top: 30px;
  margin-bottom: 5px;
  margin-left: 5%;
  margin-right: 5%;
  padding: 4px;
}
h1:first-letter {
  font-size:24pt;
  color:#f66;
}
h1 img {
  display:none;
}

ol {
  margin: 5px 10%;
  padding: 10px  0px;
  list-style-position: inside;
  border-bottom:2px dashed #666;
}
ol[style] {
  display: none;
}

li {
  font-size: 12pt;
}

.modified {
 color:#060;
 font-size:small;
}


/****** 更新内容 ******/  
.diff {
  font-size: normal;
  border-top:2px solid #009;
  border-right:2px dotted #009;
  border-bottom:2px solid #009;
  border-left:2px dotted #009;
  background-color: #f3f3ff;
  margin: 4px auto;
  padding: 4px 15px;
  max-height: 200px;
  _height:150px !important;
  overflow: auto;
}


/****** 既読非表示ボタン ******/
#navi_toggle {
 margin-top:1.5em;
}


/****** おとなりアンテナ|おすすめページ ******/
#pager_relate {
 display:none;
}


/****** フッターメニュー ******/
div.amenu {
 background-color:#fff;
 position:fixed;
 width:100%;
 left:0px;
 top:0px;
 margin:0px;
 padding:1px;
 text-align:center;
 border-bottom:2px dashed #99f;
}
div.amenu a {
 border-left:1px solid #99f;
 border-right:1px solid #99f;
 padding:0px 5px;
 font-size:70%;
 font-weight:normal;
}