fumichu サンプル | |||
カテゴリー:クール | ベーステーマ:なし | ヘッダー:■標準(細) | |
登録日:2010/01/30 | 更新日:2019/01/13 | 利用数:120 | |
http://a.hatena.ne.jp/designset/76 Ocean Noteのカスタマイズ版です。 パソコンとスマートフォンで使えます。 推奨設定 アンテナの設定 > 表示設定 > 更新内容の表示文字数 > 100文字 テーマ/ヘッダを選択 > テーマ > なし テーマ/ヘッダを選択 > ヘッダタイプ > 細いヘッダ 動作確認 Windows (Chrome , Edge) iPhone , Android (Chrome) 更新履歴 2017年4月9日 マイナーアップデート。 2019年1月13日 「はてなアンテナの画像ビューを廃止」に対応。 |
<a name="top" id="top"></a> <meta name="format-detection" content="telephone=no"> <meta name="viewport" content="width=device-width,"> <div id="hatena-header"> <form method="get" action="search" class="search-form"> <input type="text" class="search-word" name="wd" value=""> <input type="submit" name=".submit" value="Search" class="css3button"></form> <div id="pager_group" class="pager"> <a href="simple">簡素表示</a> | <a href="edit">管理画面</a> | <a href="add">新規追加</a> | <a href="http://www.hatena.ne.jp/my">Myはてな</a> </div> </div><a href="#top"><h1>はてなアンテナ</h1></a>
<div align="center" class="pager">Think different.</div>
.search-word{ width:500px; border:none; margin-top:10px; margin-left:10px; vertical-align:-9px; font-size:2em; } .css3button { font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #ffffff; padding: 10px 20px; background: -moz-linear-gradient( top, #00c8ff 0%, #0095ff 50%, #0066ff); background: -webkit-gradient( linear, left top, left bottom, from(#00c8ff), color-stop(0.50, #0095ff), to(#0066ff)); border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border: 4px solid #0040ff; -moz-box-shadow: 1px 1px 3px rgba(000,000,000,0.5), inset 0px 0px 2px rgba(255,255,255,0.1); -webkit-box-shadow: 1px 1px 3px rgba(000,000,000,0.5), inset 0px 0px 2px rgba(255,255,255,0.1); text-shadow: 0px 0px 0px rgba(000,000,000,0.5), 0px 0px 0px rgba(255,255,255,1); } a { border-top: 1px solid #; border-right: 1px solid #; border-bottom: 1px solid #; border-left: 1px solid #; font-weight: bold; } body{ /* -------------------- mobile safari -webkit-text-size-adjust:none; -------------------- */ -webkit-text-size-adjust:auto; } #hatena-header form.search-form { display: inline; } #simple-header { display: none; } *{ margin:0; padding:0; } /* -------------------- 全体 -------------------- */ body{ top:0; left:0; width:850px; overflow-x:hidden; border-right:solid 1px #ccc; border-left:solid 1px #ccc; background-color:#222; font-size:100%; color:#3B3C3D; background-image: url(http://cdn-ak.f.st-hatena.com/images/fotolife/f/fumichu/20100116/20100116030504.png); background-position : 50% 50%; background-repeat: no-repeat; background-attachment: fixed; } div.hatena-body{ background-image: url(http://b.hatena.ne.jp/images/alpha/alpha-035.png); } /* -------------------- h1 , pager -------------------- */ h1{ position: fixed; top:0; left:850px; width:1em; overflow:hidden; color:#eee; text-align:center; font-size:780%; line-height:1em; font-family: SF Pro JP,SF Pro Text,SF Pro Icons,AOS Icons,Hiragino Kaku Gothic Pro,"ヒラギノ角ゴ Pro W3","メイリオ",Meiryo,"MS Pゴシック",Helvetica Neue,Helvetica,Arial,sans-serif; } .feed-icon{ display:none; } .pager{ font-size:1.0em; padding:0.3em; margin:0.3em; } #pager_top{ } #pager_top b, #pager_bottom b{ } #pager_top b, #pager_bottom b{ } a{ } a:link{ color:#0095ff; background-color:#; text-decoration: none; padding:0.1em; margin:0.1em; } a:visited{ color:#0095ff; text-decoration: none; } a:hover { /* カーソルが上にある時のリンク */ _color: #ccc; background-color:#; text-decoration: underline; } /* -------------------- ol内 -------------------- */ ol{ padding:0.5em 1em; list-style-type:none; } .modified{ margin-left:2px; padding-right:600px; width:12em; display:block; background-color:#0066ff; color:#fff; font-family:Georgia,serif; font-weight: bold; } #hatena-antenna-normal .modified, #hatena-antenna-detail .modified{ margin-top:2em; margin-bottom:0.55em; } .diff{ margin-top:0.55em; padding-left:5px; border-left:solid 6px #0066ff; font-size:0.8em; text-align: justify; text-justify: inter-ideograph; line-height:1.55; } #hatena-antenna-simple ol li{ margin:10px 0; line-height:1.45; } #hatena-antenna-simple .modified{ padding:0px; display:inline; } #hatena-antenna-image .modified{ margin-left:0; width:12.5em; } a.screenshot img { float:right; border:1px solid #AAA; margin:3px; } /* -------------------- footer -------------------- */ .footer{ font-size:0.9em; text-align:center; margin-top:2em; border-radius: 10px; /* CSS3草案 */ -webkit-border-radius: 10px; /* Safari,Google Chrome用 */ -moz-border-radius: 10px; } /* -------------------- IE6用 -------------------- */ div.hatena-body{ _position:absolute; _left:20px; _top:0px; _width:850px; _border-right:solid 1px #2B5782; _border-left:solid 1px #2B5782; _background-image: url(http://b.hatena.ne.jp/images/alpha/alpha-035.png); } #banner{ _position:absolute; _lef:0px; _width:620px; _border-right:solid 1px #2B5782; _border-left:solid 1px #2B5782; } h1{ _position:absolute; _top:0px; } .modified{ _margin-left:0; } div.message{ position:fixed; bottom:0; }