気分転換にはてなブックマークのスキンを作った

そもそもはてブ自体あんまり使わんけど 気分転換にスキンでも作った
完全に自分用でヘッダとかない…可読性は別に重視せんからピクセル指定のとこあり…

サンプルは僕のはてブからどうぞ。

もしかしたらもの好きな人もいるかもしれないので
ソース置いときます。コピーしてスタイルシートのとこに貼り付けてください。
基本テーマ・白ヘッダ用です。

あ、コレクションは僕が使ってないので なんもしてないです。
IE…そんなブラウザ聞いたことないです。(IEでみたらゲストのときにメニューのとこ崩れます)
テーブルなんか使うから…

.main:after{content:".";display:block;height:0;clear:both;visibility:hidden;}.main{display:inline-block}.main{*height:1%;display:block;}a{overflow:hidden;}body{font-family:Verdana, Helvetica;font-size:90%;text-align:center;}body *{text-align:left;}div#banner{border:none;display:none;width:900px;position:relative;margin:0 auto;}form.searchform{float:none;border:none;width:900px;position:static;background:url(/hatena/img/srch_text.gif) no-repeat 719px center;text-align:right;margin:.5em auto 0;}form.searchform input.searchword{border:none;width:145px;height:26px;background:none;margin:10px 31px 0 0;}div#bannerSub{border:none;width:900px;margin:.5em auto 0;}div#bannersub table{border-collapse:collapse;}div#bannersub td{font-size:11px;padding:0;}div#bannersub td:first-child{background:none;}div#bannersub td a{margin-left:.5em;border:solid #DFDFDF 1px;border-bottom:none;display:block;background:#F0F0F0;padding:3px 7px;}div#bannersub td a:hover{background:#FAFAFA;}div#bannersub td a.username,div#bannersub td:first-child a{border:none;display:inline;background:url(http://b.hatena.ne.jp/images/by.gif) no-repeat left center;text-decoration:none;margin:0 .5em;padding:0 0 0 1.2em;}div#bannersub td a.username:hover,div#bannersub td:first-child a:hover{background:url(http://b.hatena.ne.jp/images/by.gif) no-repeat left center;}div.body{border:solid #DFDFDF 1px;width:898px;*width:900px;color:#000;margin:0 auto;}div.header{border:none;background:#FAFAFA;text-align:center;margin:0;padding:.5em 0;}div.header h2{color:#93bc37;background:none;font-size:100%;letter-spacing:.1em;margin:0;padding:0;}div.header ul.bookmarkinfo{margin:0;padding:0;}div.header ul.bookmarkinfo li img{position:relative;top:1px;}div.header ul.bookmarkinfo li a img{top:.1em;}div.body a{border:none;color:#282828;}div.body a:hover{color:#666;text-decoration:none;}div.body div.breadcrumbs p{margin-top:0;color:#666;text-align:right;font-size:10px;padding:.5em .5em 0;}form.hatena-usersearch{text-align:right;margin:.5em 0 0;padding:0 .5em;}form.hatena-usersearch input{border:none;border-bottom:dotted #DFDFDF 1px;background:#FFF;}div.body div.main div.pager{margin:-10px 0 0;padding:0;}div.body div.main div.pager p{font-size:12px;font-weight:700;margin:0;padding:.5em 0 0 1em;}div.body div.main div.pager p a{font-size:10px;font-weight:400;}div.body div.main div.taglist{width:250px;margin:1em 10px 0;padding:0;}div.body div.main div.taglist h3{color:#93bc37;margin:0 0 .5em;}div.body div.main input#tag_search{border:none;border-bottom:dotted #DFDFDF 1px;}div.body div.main div.taglist div.taglist-widget{margin-bottom:.5em;}div.body div.main div.taglist div.taglist-widget h3{padding-bottom:.5em;margin:0;}div.body div.main div.taglist p.tagcrumbs{margin:0;padding:0 0 .5em;}div.body div.main div.taglist ul#related-taglist{border:dotted #DFDFDF 1px;background:#EEE;padding:.5em;}ul#taglist{border:dotted #DFDFDF 1px;background:#EEE;padding:.2em .5em;}div.body div.main dl.bookmarklist{margin-left:10px;border:solid #DFDFDF 1px;width:610px;}div.body div.main dl.bookmarklist dt.bookmark{border-bottom:dotted #DFDFDF 1px;background:#EEE;margin:0 0 .5em;padding:.3em .5em;}div.body div.main dl.bookmarklist dd{xmargin:0;}div.body div.main dl.bookmarklist dd dt img{position:relative;top:.1em;}div.body div.main dl.bookmarklist dd.comment{color:#333;padding:.5em 0;}div.body div.main dl.bookmarklist dd.comment span.tag{margin-right:.3em;color:#333;}div.body div.main dl.bookmarklist dd.comment a{color:#333;margin:0 .1em;}div.body div.main dl.bookmarklist dd.content{border-top:dotted #DFDFDF 1px;margin:0 1em;padding:.5em 0;}div.body div.main dl.bookmarklist dd dd.users strong,div.body div.main dl.bookmarklist dd dd.users em{background:#FFF;}ul.taglist a.tag-latest{color:#282828;}ul.taglist a.tag-later{color:#888;}div.body div.main div.favoritelist{width:250px;background:#FFF;border-color:#DFDFDF;margin:1em 10px 0;}div.body div.main div.favoritelist h3{border-bottom:dotted #DFDFDF 1px;color:#93bc37;background:#FAFAFA;margin:0;padding:.3em .5em;}div.body div.main div.favoritelist ul{margin:0;padding:.2em .5em;}div.body div.main div.favoritelist ul li{line-height:1.5;}div.body div.main div.favoritelist ul li a{text-decoration:none;}div.body div.main div.favoritelist form.favorite{margin:0;padding:.2em .5em .5em;}form.searchform input.searchbutton,div.body div.main dl.bookmarklist dd.comment img.comment_img{display:none;}div.body div.breadcrumbs p a,ul.taglist a.tag-earlier{color:#666;}div.body div.main div.taglist div.taglist-widget h3 input,div.body div.main div.favoritelist form.favorite input{border:none;border-bottom:dotted #DFDFDF 1px;background:none;}ul#taglist li a.currenttag,div.body div.main dl.bookmarklist dd dd.users strong a,div.body div.main dl.bookmarklist dd dd.users em a{color:#93bc37;}

確認環境

Windows: Firefox3, Opera9.5, Safari3, Chrome
IE6,7は非ログイン時にメニューがくずれます(:first-childセレクタが使えないため)