自作はてなテンプレート晒し
細かいところの調整はまだですが、暫定的に晒します
<!--はてなダイアリーフッター-->
</div>
<div class="infobar">
<hatena name="sectioncategory" template="hatena-module">
<hatena name="searchform" template="hatena-module">
<!--hatena name="keywordcloud" template="hatena-module"-->
<hatena name="pv" template="hatena-module">
<hatena name="section" template="hatena-module">
<hatena name="calendar2photo" template="hatena-module">
<hatena name="profile" template="hatena-module">
<hatena name="comment" template="hatena-module">
<div class="hatena-widget">
<script type="text/javascript" src="http://widget.booklog.jp/blogparts/js/booklog_minishelf.js?metal" id="booklog_minishelf"></script>
<script type="text/javascript" src="http://api.booklog.jp/json/oratta?category=0&count=30&callback=booklog_minishelf"></script>
</div>
<hatena name="bcounter">
<a href="http://iddy.jp/profile/oratta/" title="My Profile">
<img width="88" alt="My Profile by iddy" src="http://iddy.jp/image/banner/88x31_05.gif" height="31">
</a>
<div class="hatena-module">
<div class="hatena-moduletitle">リンク集</div>
<div class="hatena-modulebody">
<ul class="hatena-urllist">
<!--
<li><a href="http://www.hatena.ne.jp/">はてな</a></li>
<li><a href="http://d.hatena.ne.jp/">はてなダイアリー</a></li>
-->
<li><a href="http://hatenadiary.g.hatena.ne.jp/keyword/はてなダイアリー利用可能タグ">HTML利用可能タグ</a></li>
<li><a href="http://hatenadiary.g.hatena.ne.jp/keyword/はてな記法一覧">はてな記法</a></li>
</ul>
</div>
</div>
</div>
</div>/*はてなダイアリーCSS*/
/* orattaの日記スタイルシート */
/* はてなデフォルトスタイル */
span.highlight {
color: black;
background-color: yellow;
}
img.photo {
margin:1em ;
border: none ;
}
/* body要素 */
body {
margin : 0; padding : 0;
color: #333; /*文字色の設定 */
font-family: osaka, verdana, sans-serif; /*フォントの種類*/
background-color: #CCC; /*←効果をわかりやすくするため。なくても良い*/
font-size:100% ; /*フォントの大きさの設定*/
}
body * { font-size:100% ; /*フォントの大きさの設定。閲覧者のブラウザ設定にまかせる*/}
/* 日記表示枠 */
div.day, div.calendar {
color:#333 ; /* 文字色の設定 */
background-color:#fff ; /* 背景色の設定 */
/*border:1px #999 solid ;*/ /* 枠線の設定 */
margin:2em 0 ; /* 枠の外側の余白設定 */
padding:0 ; /* 枠の内側の余白設定 */
line-height:2em ; /* 本文の行の高さの設定 */
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
border-width:2px 8px 2px 2px ; /* 枠線の幅 */
border-color:#999 ; /* 枠線の色 */
border-style:solid ; /* 枠線のスタイル */
}
div.section {
padding:1em 1em ; /* 枠の内側の余白設定 */
border:1px #999 dashed ; /* 枠線の設定 */
margin:10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
/* リンクアンカー */
a:link { color: #5555ff /* まだ見ていないリンク */}
a:visited { color: #bb55bb; text-decoration: none /* すでに見たリンク */}
a.keyword { color: #333; text-decoration: none; border: none; /* はてなキーワードは黒のまま */}
/*基本要素*/
pre{
border:1px #999 dashed ; /* 枠線の設定 */
padding:2em ; /* 枠の内側の余白設定 */
line-height:1.2em ; /* 行の高さの設定 */
font-size:80% ; /*フォントの大きさの設定*/
overflow:scroll ; /* はみ出したらスクロール */
}
table{
border:1px #999 solid;
}
tr{
border:1px #999 solid;
}
td{
border:1px #999 solid;
}
ul,ol,dl { /* 箇条書きリスト、番号つきリスト、定義リストのまとめ設定 */
font-size:100% ;
line-height:1.5em ;
margin-left:1em ;
padding-left:1em ;
list-style-position:outside ;
}
div.main ol { /* 日記本文内にある番号つきリスト */
margin:1em 0 1em 1.5em;
padding:0 ;
}
div.main ul { /* 日記本文内にある箇条書きリスト */
list-style-type:none ;
margin:1em 0 1em 1.5em;
padding:0 ;
}
div.main li { /* 日記本文内にある箇条書き・番号つきリストの項目の装飾 */
border-bottom:1px #999 solid ;
color:#333 ;
margin:0 ;
padding:0.2em ;
list-style-type: circle;
}
dt { /* 定義リストの定義語部分 */
line-height:2em ;
font-weight:bold ;
padding:0.5em 0 0 0 ;
border-bottom:1px #fff solid ;
}
dd { /* 定義リストの説明文 */
padding:0 0 1em 0 ;
}
strong {
font-size:120% ;
font-weight:bold ;
font-style:normal ;
}
/*見出し要素*/
h1,h2,h3,h4,h5,h6 {
font-weight:bold ; /* 見出しは全部太字に */
margin:0 ; /* 外側の余白 */
padding:0 ; /* 内側の余白 */
}
h1 {
width : 85% ; /*←数値は適当*/
margin : 10px auto;
padding : 20px 0px; /*←なくても良い*/
text-align: center ; /*←なくても良い*/
background-color: #ffffff; /*←効果をわかりやすくするため。なくても良い*/
border-width:2px 8px 2px 2px ; /* 枠線の幅 */
border-color:#999 ; /* 枠線の色 */
border-style:solid ; /* 枠線のスタイル */
font-size:200% ; /* 文字サイズ */
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}
h1 a:link,h1 a:visited,h1 a:hover,h1 a:active {color:#333;/*タイトルがリンクだけど色は黒のまま*/}
h2 {
font-size:140% ; /* 文字サイズ */
color:#333 ; /* 文字色 */
margin:0.5em 0 ; /* 外側の余白 */
padding-left:1em ; /* 内側左の余白 */
border-bottom:2px #999 solid ; /* 下に枠線表示 */
}
div.main h2 {
/*日付もh2なので、日付と日記内のh2を区別する*/
/*日記内のh2用の設定 */
font-size:140% ; /* 文字サイズ */
color:#333 ; /* 文字色 */
padding-left:1em ; /* 内側左の余白 */
border-color:#999 solid; /* 下線の色を変更 */
}
h3 {
font-size:130% ; /* 文字サイズ */
color:#333 ; /* 文字色 */
margin:1em 0 ; /* 外側の余白 */
border-bottom:3px #999 solid ; /* 下に枠線表示 */
}
h4 {
font-size:120%;
border-width:1px 8px 1px 0 ; /* 枠線の幅 */
border-color:#999 ; /* 枠線の色 */
border-style:solid ; /* 枠線のスタイル */
margin:0.5em 0 ; 外側の余白
padding-top:0.25em ; /* 内側左の余白 */
width:50% ; /* 横幅を表示領域の50%に設定 */
}
h5 {
font-size:120%;
padding-top:0.5em ; /* 内側上の余白 */
border-bottom:1px #999 solid ; /* 下に枠線表示 */
}
/*日記本体 */
div.main {
/*基本設定*/
width:78% ; /* 日記本体の横幅を全体の80%に */
margin-left:1% ; /* 左側に一文字分の余白 */
float:left ; /* 左側に配置して回り込み設定 */
padding:0 ; /* 内側の余白設定 */
/*
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}
/*サイドバー関連 */
div.infobar {
/*サイドバーからあふれる文字列を表示しないようにする設定*/
word-break: break-all;
overflow:hidden;
/**/
/*基本設定*/
font-size:100% ; /* フォントのサイズを100%に */
color:#333 ; /* 文字色 */
background-color:#fff ; /* 背景色 */
width:18% ; /* サイドバー部分の横幅を全体の18%に */
margin-right:1% ; /* 右側に1%の余白 */
padding:0.1% ; /* 内側の余白設定 */
float:right ; /* 右側に配置して回り込み設定 */
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
border-width:2px 8px 2px 2px ; /* 枠線の幅 */
border-color:#999 ; /* 枠線の色 */
border-style:solid ; /* 枠線のスタイル */
}
div.hatena-moduletitle {
/*サイドバーのタイトル */
color:#333 ; /* 文字色 */
font-size:100% ; /* フォントのサイズ */
border-color:#333 ; /* 下線の色 */
padding:0.25em 0 ; /* 内側上下の余白 */
}
div.hatena-module{
/*サイドバーのコンテンツ*/
margin:10px;
border:2px #999 solid;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
/*サイドバーからあふれる文字列を表示しないようにする設定*/
word-break: break-all;
overflow:hidden;
}
div.infobar ul {
font-size:80% ; /* フォントのサイズ */
list-style-type:none ; /* 箇条書きのマークを消す */
margin:0 ; /* 外側余白 */
padding:0 ; /*内側余白 */
}
div.infobar li ul {
margin:0 0 1em 0.5em ; /* リストの入れ子の下げ幅 */
font-size:100% ; /* 文字サイズを上位の要素に揃へる */
}
li.index,ul.hatena-section li {
border-bottom:1px #990 solid ; /* 手作りのリスト項目に下線表示 */
}
/* calendar2モジュール*/
table.calendar {
font-size:72% ; /* カレンダーの文字サイズ */
margin:auto ; /* 枠の外側余白 */
padding-left:2% ; /* 内側左の余白 */
text-align:center ; /* カレンダー内の字詰めを中央に */
width:80%;
}
table.calendar * { /* カレンダー内の各要素の余白と罫線をキャンセル */
margin:0 ;
padding:0 ;
border:0 ;
}
td.calendar-day { color:#666 ; background-color:#ccc ; } /* 日付部分の基本色 */
td.calendar-sunday { color:#c00 ; background-color:#c66 ; } /* 日曜部分 */
td.calendar-weekday { color:#000 ; background-color:#eee ; } /* 平日部分 */
td.calendar-saturday { color:#00c ; background-color:#66c ; } /* 土曜部分 */
td.calendar-prev-month,td.calendar-current-month,td.calendar-next-month { color:#000 ; background-color:#ddd ; } /* ナビゲーション部分 */
td.calendar-day a { color:#000 ; background-color:#ccc ; } /* 日付部分のリンク色 */
td.calendar-day a:hover { color:#fff ; background-color:#933 ; } /* 日付部分のマウスロールオーバー */
/* calendarモジュール */
div.calendar {
margin:0 ; /* 外側余白 */
padding:1em ; /* 内側余白 */
font-size:80% ; /* 文字サイズ */
line-height:1.2em ; /* 一行の高さ */
}
/* コメント欄 */
div.comment {
margin:0 ; /* 外側余白 */
background-color:#363 ; /* 背景色 */
border-top:1px #999 solid ; /* 上に罫線表示 */
}
div.caption {
padding:0 1em ; /* [コメントを書く]部分の内側余白 */
border-bottom:1px #999 solid ; /* 下に罫線表示 */
}
div.commentshort p {
margin:0 ; /* 外側余白 */
padding:0.5em 1em ; /* 内側余白 */
border-bottom:1px #696 solid ; /* コメントの下に罫線表示 */
line-height:1.4em ; /* 改行幅設定 */
}
/* 脚注 */
div.footnote {
padding:1em ; /* 内側余白 */
background-color:#EEE ; /* 背景色 */
border-top:1px #999 solid ; /* 上に罫線表示 */
line-height:1.2em ; /* 改行幅設定 */
}
div.footnote p {
margin:0 ; /* 脚注段落の余白キャンセル */
}
span.footnote {
font-size:60% ; /* 本文中の脚注アンカーの文字サイズ */
}
/* ナビゲーションメニュー */
ul.tab {
font-size:96% ; /* 文字サイズ */
list-style-type:none ; /* リスト項目の先頭マークをキャンセル */
margin:0 ; /* 外側余白 */
padding:0.2em 0 ; /* 内側余白 */
color:#333 ; /* 文字色 */
background-color:#77bac1 ; /* 背景色 */
border-bottom:1px #276d75 solid ; /* 下側の罫線 */
text-align:right ; /* リスト項目を右揃へに */
}
ul.tab li {
display:inline ; /* リスト項目を一行に収める */
margin:0 0.5em ; /* 外側余白 */
}
ul.tab li a { color:#daeef2 ; background-color:transparent ; } /* リンク色 */
ul.tab li a:hover { color:#fff ; background-color:#933 ; } /* マウスロールオーバー */
form.hatena-searchform {
display:inline ; /* 検索フォームを一行に収める */
font-size:80% ; /* 検索フォームの文字サイズ */
}
/*段落の設定manpukuyaさんの設定を拝借*/
div.section p{
line-height:1.5;
margin-top:0.5em;
margin-bottom:0.5em;
padding-top:0;
padding-bottom:0;
}
