ふとんのなかから

びまん性大細胞型B細胞リンパ腫にかかったあとだらだらしている人のブログ

はてなデザイン改造 その2

とりあえずできた。のでソース晒し。名前をつけるならそのまんま「TATEGAKI」か。IEだけh1要素が意図どおりにならないので結局一ヵ所だけ画像を使用。IEのアホ!


特徴

  • h1タイトルが縦書きになる。
  • ただしアルファベットは不可(横書きで表示される)。
  • 13文字までのブログタイトルに対応。
  • 04-1021追記:h1タイトルを明朝体に。「編集」ボタン・段落行頭字下げ追加。


使用画像
http://urawa.cool.ne.jp/subark/title-bar2.png


使い方

  1. 上記画像を落としてどこかに保管する。
  2. 保管場所URLを下記ソースの「画像のURL」のところに書く。
  3. 設定画面でテーマを「90」にする。
  4. スタイルシート欄にソースを貼り付ける。
  5. おわり。
body{ 
font-family: sans-serif, Verdana, Osaka;
background-color: #606060;
}

.day{
background-color: white;
padding: 10px 40px;
}

.main{
position: absolute;
top: -95px;
left: 100px;
right: 20%;
margin: 0;
padding: 0;
border: none;
}

span.title{
font-family: sans-serif, Verdana, Osaka; 
}

h1 {
font-size: 230%;
font-family: serif,sans-serif,"Trebuchet MS",osaka;
margin: 30px 90% 0 35px;
padding: 5px 5px 5px 5px;
background: url("http://urawa.cool.ne.jp/subark/title-bar2.png") no-repeat center left #606060;
}

h3{
margin: 0 0 5px 0;
padding: 0 0 2px 0;
border-bottom: solid 1px #606060;
}

h2{
background-color: white;
font-size:140%;
padding: 2px 0 2px 20px;
margin: -10px -40px 0 -40px;
border-top: dashed 1px #606060;
border-bottom: dashed 1px #606060;
}

.section p{
text-indent: 1em;
}

.sidebar {
position: absolute;
top: -95px; 
left: 82%;
right: 0px;
background-color: transparent;
border: none;
}

.hatena-moduletitle{
font-family: sans-serif, Verdana, Osaka;
border-top: dashed 1px #606060;
border-bottom: dashed 1px #606060;
background-color: white;
}

.hatena-modulebody{
font-size: 100%;
border: none;
background-color: white;
}

td.calendar-current-month{
width: 44%;
}

td.calendar-prev-month,
td.calendar-next-month{
width:28%;
}

div.calendar{
font-size: 100%;
text-align: left;
}

div.main div.calendar{
text-align: right;
}

div.refererlist ul,
div.comment ul{
font-size: 100%;
}

div.caption{
font-size: 100%;
}

div.day form,
form .day{
border: none;
padding: 0 0.5em;
margin: 0.5em 0;
}

img.photo{
margin: 2.1em 1em 10px 10px;
}

textarea{
width:85%;
height:20em;
}

pre{
background-color: #eeeeee;
overflow: auto;
}

blockquote{
background-color: #eeeeee;
overflow: auto;
}

a.edit{
font-size: 10px;
font-weight: normal;
border: outset 3px #606060;
color: #606060;
background: white;
margin: 0;
padding: 2px 4px;
text-align: center;
}