無料ブログをかんたん作成
無料ブログ作成ならJUGEM(ジュゲム)
ホーム
ブログ作成
ブログを書く
ブログを見る
無料ブログ作成
JUGEM PLUS お申し込み
サービス紹介
JUGEM(無料ブログ)
JUGEM PLUS(有料プラン)
ブログ機能一覧表
デザイン
公式ブログデザイン
PC版
スマートフォン版
ユーザー作成
ユーザー作成
JUGEM を楽しむ
投稿する・みんなとつながる
ブログテーマ
ブログのお題
その他のコンテンツ
芸能人・有名人のブログ
スペシャルインタビュー
JUGEM を楽しむ 一覧
サポート
管理者ページ・マニュアル
FAQ
お知らせ
新着情報
メンテナンス情報
障害情報
おすすめブログ紹介
このページでは JavaScript を使用しています。JavaScript を有効にしてください。
ホーム
>
ブログデザイン一覧
>
ユーザー作成テンプレート「utf」
>
テンプレートHTML・CSSについて
公開されているテンプレートのHTMLに{ad}タグがないものありますので、エラーが表示された場合は{ad}タグを追加してご利用ください。
テンプレートの利用について
弊社が著作権を所有する画像等以外のテンプレートに関する著作権は制作者にあります。弊社提供以外のブログサービスで利用した場合は、その都度制作者の方にご確認ください。
テンプレート名 :
Sitting Girl Aqua
テンプレートイメージ表示ページへ戻る
HTML・CSSをコピーして使う
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset={site_encoding}" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>{site_title}</title> <link rel="stylesheet" href="{site_css}" type="text/css" /> <link type="text/css" href="{gmo_header_css}" rel="stylesheet" media="screen,print" /> <link rel="alternate" type="application/rss+xml" title="RSS" href="{site_rss}" /> <link rel="alternate" type="application/atom+xml" href="{site_atom}" /> <link rel="alternate" media="handheld" type="application/xhtml+xml" href="{mobile_url}" /> <script type="text/javascript" src="./template/js/cookie.js"></script> <script src="./template/analogue/menu.js" type="text/javascript"></script> </head> <body onload="javascript:initval();" id="{index}{cid}{page}{month}{search}"> <!--ラッパー(ページ全体)ここから--> <div id="wrapper" class="clearfix"> <a name="top"></a> <!--コンテナ(メインとサイドの枠)ここから--> <div id="conteiner" class="cleafix"> <!--左サイドここから--> <div id="left_side"> <!--ヘッダーここから--> <div id="header"> <!-- BEGIN title --> <h1>{blog_name}</h1> <div id="blog_description"> {blog_description} </div> <!-- END title --> </div> <!--/ヘッダーここまで--> <!--メニューリストここから --> <div class="linkmenu"> <!--リスト用テーブルここから--> <table id="menu_list" cellpadding="0" cellspacing="0"> <tr> <td class="menu_title"><a href="" onclick="return buttonClick(event, 'MENU1');">CALENDAR</a></td> <td class="menu_title"><a href="" onclick="return buttonClick(event, 'MENU2');">ARCHIVE</a></td> </tr> <tr> <td class="menu_title"><a href="" onclick="return buttonClick(event, 'MENU3');">ENTRY</a></td> <td class="menu_title"><a href="" onclick="return buttonClick(event, 'MENU4');">COMMENT</a></td> </tr> <tr> <td class="menu_title"><a href="" onclick="return buttonClick(event, 'MENU5');">TRACKBACK</a></td> <td class="menu_title"><a href="" onclick="return buttonClick(event, 'MENU6');">CATEGORY</a></td> </tr> <tr> <td class="menu_title"><a href="" onclick="return buttonClick(event, 'MENU7');">SEARCH</a></td> <td class="menu_title"><a href="" onclick="return buttonClick(event, 'MENU8');">LINK</a></td> </tr> <tr> <td class="menu_title"><a href="" onclick="return buttonClick(event, 'MENU9');">FREE SPACE</a></td> <td class="menu_title"><a href="" onclick="return buttonClick(event, 'MENU10');">RECOMMEND</a></td> </tr> <tr> <td class="menu_title"><a href="" onclick="return buttonClick(event, 'MENU11');">PROFILE</a></td> <td class="menu_title"><a href="" onclick="return buttonClick(event, 'MENU12');">OTHERS</a></td> </tr> </table> <!--/リスト用テーブルここまで--> </div> <!--/メニューリスト(linkmenu)ここまで--> <!--各メニューの内容ここから--> <!--カレンダーここから--> <div id="MENU1" class="MENU"> <!-- BEGIN calendar --> <div class="list_text"> {calendar2} </div> <!--/list_text--> <!-- END calendar --> <div class="list_title"> CALENDAR </div> </div> <!--/カレンダーここまで--> <!--アーカイヴここから--> <div id="MENU2" class="MENU"> <!-- BEGIN archives --> <div class="list_text"> {archives_list2ex} </div> <!-- END archives --> <div class="list_title">ARCHIVE</div> </div> <!--/アーカイヴここまで--> <!--最新の記事ここから--> <div id="MENU3" class="MENU"> <!-- BEGIN latest_entry --> <div class="list_text"> {latest_entry_list} </div> <!-- END latest_entry --> <div class="list_title">LATEST ENTRY</div> </div> <!--/最新の記事ここまで--> <!--最近のコメントここから --> <div id="MENU4" class="MENU"> <!-- BEGIN recent_comment --> <div class="list_text"> {recent_comment_list} </div> <!-- END recent_comment --> <div class="list_title">RECENT COMMENT</div> </div> <!--/最近のコメントここまで--> <!--最近のトラックバックここから--> <div id="MENU5" class="MENU"> <!-- BEGIN recent_trackback --> <div class="list_text"> {recent_trackback_list} </div> <!-- END recent_trackback --> <div class="list_title">RECENT TRACKBACK</div> </div> <!--/最近のトラックバックここまで--> <!--カテゴリーここから--> <div id="MENU6" class="MENU"> <!-- BEGIN category --> <div class="list_text"> {category_list} </div> <!-- END category --> <div class="list_title">CATEGORY</div> </div> <!--/カテゴリーここまで--> <!--検索ここから--> <div id="MENU7" class="MENU"> <div class="list_text"> Search this site. <form method="get" action="./" id="search"> <input type="text" id="s_word" name="search"/> <input type="submit" value="Search" class="s_submit" /> </form> </div> <div class="list_title">SEARCH</div> </div> <!--/検索ここまで--> <!--リンクここから --> <div id="MENU8" class="MENU"> <!-- BEGIN link --> <div class="list_text"> {link_list} </div> <!-- END link --> <div class="list_title">LINK</div> </div> <!--/リンクここまで--> <!--フリースペースここから --> <div id="MENU9" class="MENU"> <div class="list_text"> <!-- フリースペース1 --> <!-- BEGIN freespace1 --> <div class="f_t">{freespace_title1}</div> <div class="f_c">{freespace_contents1}</div> <!-- END freespace1 --> <!-- フリースペース2 --> <!-- BEGIN freespace2 --> <div class="f_t">{freespace_title2}</div> <div class="f_c">{freespace_contents2}</div> <!-- END freespace2 --> <!-- フリースペース3 --> <!-- BEGIN freespace3 --> <div class="f_t">{freespace_title3}</div> <div class="f_c">{freespace_contents3}</div> <!-- END freespace3 --> <!-- フリースペース4 --> <!-- BEGIN freespace4 --> <div class="f_t">{freespace_title4}</div> <div class="f_c">{freespace_contents4}</div> <!-- END freespace4 --> <!-- フリースペース5 --> <!-- BEGIN freespace5 --> <div class="f_t">{freespace_title5}</div> <div class="f_c">{freespace_contents5}</div> <!-- END freespace5 --> <div class="list_title">FREE SPACE</div> </div><!--/list_text--> </div><!--/MENU11--> <!--/フリースペースここまで--> <!--リコメンド(アマゾン)ここから--> <div id="MENU10" class="MENU"> <!--アマゾン商品全体の枠ここから--> <!-- BEGIN amazon --> <div class="list_text"> <!--amazon1商品ここから--> <div class="amazon"> <!--amazon商品画像--> <a href="{amazon_url}" target="_blank"> <img border="0" src="{amazon_ImageUrlSmall}" alt="{amazon_ProductName}" class="amazon_pict" /> </a> <br /> <!--amazon商品名--> <a href="{amazon_url}" target="_blank"><strong>{amazon_ProductName}</strong></a> <!--amazon説明--> <div class="amazon_text"> [ {amazon_Creator} ]<br /> {amazon_comment} </div><!--/amazon_text--> </div><!--/amazon(1商品ここまで)--> </div><!--/list_text(アマゾン商品全体の枠ここまで)--> <!-- END amazon --> <div class="list_title">RECOMMEND</div> </div><!--/MENU9--> <!-- /リコメンド(アマゾン)ここまで/ --> <!--プロフィール等ここから--> <div id="MENU11" class="MENU"> <!--プロフィールここから--> <!-- BEGIN profile --> <div class="list_text"> {user_list} <ul> <li>書いた記事数:{all_entry_count}</li> <li>最後に更新した日:{last_entry_date}</li> </ul> </div> <!-- END profile --> <div class="list_title">PROFILE</div> </div> <!--/プロフィール等ここまで--> <!--その他ここから--> <div id="MENU12" class="MENU"> <div class="list_text"> <!--ログイン他 --> <ul> <li><a href="./manage/">管理者ページ</a></li> <li><a href="./?mode=rss">RSS1.0</a></li> <li><a href="./?mode=atom">Atom0.3</a></li> </ul> <!--/ログイン他ここまで --> <!--モバイル(QRコード)ここから--> <div class="f_t">MOBILE</div> <div id="qr"> {site_qrcode} </div><!--/qr--> <!--/モバイル(QRコード)ここまで--> </div><!--/list_text--> <!-- END profile --> <div class="list_title">OTHERS</div> </div><!--/MENU12--> <!--/その他ここまで--> <!--/各メニューの内容ここまで--> <br class="clear" /> </div> <!--/左サイドここまで--> <!--メイン(中央部分)ここから--> <div id="main"> <!-- 前後の記事ここから --> <!-- BEGIN sequel --> <div id="entry_navi"> {prev_entry} ● <a href="./" title="main">main</a> ● {next_entry} </div> <!-- END sequel --> <!--/前後の記事ここまで --> <!--記事ここから--> <!-- BEGIN entry --> <div class="entry"> <!--記事のタイトル --> <h2>{entry_title_link}</h2> <!--記事本文ここから --> <div class="entry_body"> {entry_description} </div> <!--/記事本文ここまで --> <!--記事の続きここから --> <a name="sequel"></a> <div class="entry_more"> {entry_sequel} </div> <!--/記事の続き ここまで--> <!--記事情報ここから --> <div class="entry_state"> {entry_year}年{entry_month}月{entry_day}日({entry_jpn_week}) {entry_time} by {user_name} ● <a href="./manage/?mode=write&eid={entryarea_id}" title="この記事を編集する" target="_blank">Edit</a> <br /> cetegory : {category_name} ● {comment_num} ● {trackback_num} ● <span class="state_img">{logpi_link}</span> </div> <!--/記事情報ここまで --> </div> {trackback_auto_discovery} <!-- END entry --> <!-- /記事ここまで --> <!-- 関連する記事エリアここから --> <!-- BEGIN related_entry --> <div id="related_entry"> <div id="related_title" class="main_title"> RELATED ENTRIES </div> {related_entry_list} </div> <!-- END related_entry --> <!--/関連する記事エリアここまで --> <!-- コメントエリアここから --> <!-- BEGIN comment_area --> <a name="comments"></a> <div id="comment"> <div id="comment_title" class="main_title"> COMMENT </div> <!--コメントここから--> <!-- BEGIN comment --> <!--1コメントの枠ここから--> <div class="comment_entry"> <!--コメント情報 --> <div class="comment_state"> {comment_name} ({comment_year}.{comment_month}.{comment_day} {comment_eng_week_short} {comment_hour_24}:{comment_minute}) </div> <!--コメント本文 --> <div class="comment_body"> {comment_description} </div> </div> <!--1コメントの枠ここまで--> <!-- END comment --> <!--/コメントここまで--> <!--コメント投稿欄ここから --> <div id="comment_send_title" class="sub_title"> ● SUBMIT COMMENT ● </div> <div class="comment_send_form"> <!--コメント投稿フォームここから --> <form name="comment_area" id="comment_area" action="./?mode=comment" method="post"> <input type="hidden" name="entry_id" value="{entry_id}" class="input" /> <label for="name">Name:</label> <br/> <input type="text" tabindex="1" name="name" id="name" value="{cookie_name}" class="input" /> <br /> <label for="email">Email:</label> <br /> <input type="text" tabindex="2" name="email" id="email" value="{cookie_email}" class="input" /> <br /> <label for="url">URL:</label> <br /> <input type="text" tabindex="3" name="url" id="url" value="{cookie_url}" class="input" /> <br /> <label for="description">Comments:</label> <br /> <textarea tabindex="4" id="description" name="description"></textarea> <br /> <input tabindex="5" id="c_submit" type="submit" value="submit" onclick="javascript:setval();" /> <input type="checkbox" name="set_cookie" value="1" id="set_cookie" /> <label for="set_cookie">入力情報を登録しますか?</label> </form> <!--/コメント投稿フォームここまで--> </div> <!--/コメント投稿欄ここまで--> </div> <!-- END comment_area --> <!--/コメントエリアここまで--> <!--トラックバックエリアここから --> <!-- BEGIN trackback_area --> <a name="trackback"></a> <div id="trackback"> <div id="trackback_title" class="main_title">TRACKBACK</div> <!--TBのURL--> <div id="trackback_url" class="sub_title">● TRACKBACK URL ●</div> <input type="text" id="tb_url" value="{trackback_url}" /> <!--/TBのURLここまで--> <!--TBしてきた記事ここから--> <!-- BEGIN trackback --> <div id="tb_title" class="sub_title">● TRACKBACKS ●</div> <!--TBしてきた記事のタイトル --> <div class="trackback_name">{trackback_title}</div> <!--TBしてきた記事の概要 --> <div class="trackback_body">{trackback_excerpt}</div> <!--TBしてきたブログの情報 --> <div class="trackback_state"> {trackback_blog_name} ({trackback_time}) </div> <!-- END trackback --> <!--/TBしてきた記事ここまで--> </div> <!-- END trackback_area --> <!--/トラックバックエリアここまで --> <!--プロフィールエリアここから --> <!-- BEGIN profile_area --> <div id="profile"> <div id="profile_title" class="main_title">PROFILE</div> <!--プロフィールのニックネーム --> <div id="profile_name" class="sub_title"> ● {profile_name} ● </div> <!--プロフィールの本文 --> <div id="profile_body"> {profile_description} </div> </div> <!-- END profile_area --> <!--/プロフィールエリアここまで--> <!--ページ送りここから --> <!-- BEGIN pager --> <div id="pager"> {full_pager_link} </div> <!-- END pager --> <!--/ページ送りここまで--> <!--トップへのリンクここから --> <div class="page_top"> <a href="#top" title="このページのトップへ">▲ T●P ▲</a> </div> <!--/トップへのリンクここまで --> <!--フッターここから--> <div id="footer"> <a id="bottom" name="bottom"></a> <!--著作権表示ここから--> <div id="copyright"> {copyright} <br /> Font by Darrian Lynx. <br /> Template "Sitting Girl Aqua" by <a href="http://frais76.jugem.jp/" title="† Emmanuel †" target="_blank">† Emmanuel †</a>. <br /> Powered by <a href="https://jugem.jp/" title="JUGEM" target="_blank">JUGEM</a>. </div> <!--/著作権表示ここまで--> <!--JUGEM広告ここから--> <div id="pr"> <!-- BEGIN jugem_ad --> {ad} </div> <!-- END jugem_ad --> <!--/JUGEM広告ここまで--> </div> <!--/フッターここまで--> </div> <!--/メイン(中央部分)ここまで--> </div> <!--/コンテナ(メインとサイドの枠)ここまで--> <!-- 上・下へのリンク--> <div id="up_down"> <div> <a href="#top" title="上へ">●</a> </div> <div> <a href="#bottom" title="下へ">●</a> </div> </div> <!-- /上・下へのリンクここまで/ --> <!--画像ここから--> <div id="image"><img src="http://img-cdn.jg.jugem.jp/63b/359049/20120625_148566.png" alt="Sitting Girl CFF" width="250" height="188" /></div> <!--/画像ここまで--> </div> <!--/ラッパー(ページ全体)ここまで--> </body> </html>
CSS
@charset "EUC-JP"; /* ---------------------------------------- 作成日:2012.06.25 テンプレート名: Sitting Girl Aqua(06.29/07.06修正版) by Emmanuel (http://frais76.jugem.jp) 取扱説明書 (http://frais76.jugem.jp/?eid=189) ※"analogue"のjsファイルをお借りしています。 ※テンプレート、素材共にカスタマイズの有無に関係なく再配布禁止です。 ※フッター内の著作権表示の削除も禁止です。 CSS目次 [1] Reset (ブラウザの初期設定のリセット) [2] General Structure and Styles (総合) [3] Link,H,Title (aについてはResetも参照のこと) [4] Layout (レイアウト) [5] Left Side (左サイド) [6] header (ヘッダー) [7] Conteiner,Main,Pager (コンテナ,メイン,ページャー) [8] Entry (記事) [9] Related Entry (関連記事エリア) [10] Comment (コメントエリア) [11] Trackback (トラックバックエリア) [12] Profile (プロフィールエリア) [13] Footer (フッター) [14] Text,Elements (文中の装飾等) [15] Form (フォーム) [16] Floats Clearing (フロートの調整) ---------------------------------------- */ /*============================================================= * [1] Reset (ブラウザの初期設定のリセット) =============================================================*/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; border: 0; outline: 0; } * {margin:0px; padding:0px; zoom:1;} /*見出し*/ h1,h2,h3,h4,h5,h6 {font-size:100%; font-weight:bold; margin:0; padding:0;} /*リンク*/ a {text-decoration:none; overflow:hidden;} /* remember to define focus styles! */ :focus {outline: 0;} /* テーブル:tables still need 'cellspacing="0"' in the markup */ table {border-collapse: separate; border-spacing: 0;} /*画像*/ img,a img {border:0; vertical-align:baseline;} /*リスト*/ ul li, ul ul li, ol li, ol ol li {list-style-type:none; list-style-position:inside;} /*引用*/ blockquote, q {quotes: none;} /*区切線*/ hr {border:0; clear:both; margin:1em 0;} /*改行*/ /*br.clear {clear: both;}*/ /*============================================================= * [2] General Structure and Styles (総合) =============================================================*/ /*個別のカテゴリページ(URLが ./?cid等となっている場合)に 記事の本文(.entry-body)と記事の続き(.entry-more)を非表示(display: none;)にする。 {day}(同日),{page}(ページ送り)で表示したページも同様にしたい場合はbody#day,body#pageで追加。*/ body#cid .entry_body, body#cid .entry_more, body#cid .entry_date, body#month .entry_body, body#month .entry_more, body#month .entry_date, body#search .entry_body, body#search .entry_more, body#search .entry_date { display: none; } html,body { width: 100%; text-align: center; /*wrapperを中央に配置するため*/ font-size: 13px; /*or small*/ line-height: 1.7em; /*for IE*/ color: #336; background: #9cc; font-family: "メイリオ","Meiryo","Trebuchet MS","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","MS Pゴシック","Osaka‐等幅",sans-serif; scrollbar-arrow-color: #9cc; /* IE用スクロールバーの設定 */ scrollbar-face-color: #cff; scrollbar-3dlight-color: #9cc; scrollbar-darkshadow-color: #9cc; scrollbar-highlight-color: #cff; scrollbar-shadow-color: #cff; scrollbar-track-color:#9cc; } /*color:336;background:#9cc,#cff;border:#426597,#336*/ /*============================================================= * [3] Link,H,Title (リンク,見出し等:aについてはResetも参照のこと) =============================================================*/ /*=====基本=====*/ a:link {color: #cff;} a:visited {color: #bff;} a:hover {color: #fff;} a:active {color: #fff;} /*=====ブログ名,ブログ説明(詳細は[6]ヘッダーの項にて設定)=====*/ h1 {color: #cff;} h1 a:link,h1 a:visited {color: #cff;} h1 a:hover,h1 a:active {color: #fff;} /*=====記事タイトル(詳細は[8]記事の項にて設定)=====*/ h2 {color: #cff;} h2 a:link,h2 a:visited {color: #cff;} h2 a:hover,h2 a:active {color: #fff;} /*=====サイドのメニューの各タイトル(詳細は[5]左サイドの項にて設定)=====*/ .menu_title,.menu_title a:link,.menu_title a:visited {} .menu_title a:hover,.menu_title a:active {} /*=====各メニュー内のリンク=====*/ .MENU a:link {} .MENU a:visited {} .MENU a:hover,.MENU a:active {} /*---カレンダーのリンク---*/ td.calendar_month a {} td.weekday a {} .cell a {} /*bolder,boldはIEでNG*/ .cell a:link {} .cell a:visited {} .cell a:active {} .cell a:hover {} /*=====ページャー(前後の記事,ページ送りは[7]にて後述)=====*/ /*---前後の記事---*/ #entry_navi a {} /*---ページ送り---*/ #page a {} /*---TOPへのリンク---*/ .page_top a:link,.page_top a:visited {color: #cff;} .page_top a:hover,.page_top a:active {color: fff;} /*---上・下へのリンク---*/ #up_down a:link,#up_down a:visited {color: #cff;} #up_down a:hover,#up_down a:active {color: #fff;} /*=====画像=====*/ a img {border: 0;} /*=====関連する記事,コメント,トラックバック、プロフィール各エリアのタイトル=====*/ .main_title { margin-bottom: 15px; padding: 5px; text-align: center; font-size: 1.3em; color: #cff; background: #426579; border-radius: 16px; -moz-border-radius: 16px; -webkit-border-radius: 16px; } /*---コメント投稿欄の見出し,トラックバックのURL,トラックバックしてきた記事,プロフィールのニックネーム---*/ .sub_title { font-size: 1.1em; margin-bottom: 10px; color: #426579; } /*============================================================= * [4] Layout (レイアウト) * 全体の最大の幅は(A)で設定できます。 * (B)のwitdh+(C)のwidthとmargin=99-98%以下(for IE)、 * pxで指定する場合は(B)のwitdh+(C)のwidthとmargin=(A)のwidth未満がよいと思われます。 =============================================================*/ /*=====(A)ページ全体=====*/ #wrapper { width: 994px; /*1024px-margin15px×2*/ margin: 25px auto 20px; padding: 0; background: transparent; } /*=====ヘッダー(後述)=====*/ #header {} /*=====コンテナ(メイン・サイドの枠)=====*/ #conteiner { width: 100%; margin: 0 auto; background: transparent; } /*=====(B)左サイド =====*/ #left_side { float: left; width: 28%; margin: 0 1% 0 auto; text-align: left; /*bodyでの指定を解除*/ background: transparent; } /*=====(C)メイン(中央部分全体の枠)=====*/ #main { float: left; width: 70%; margin-right: auto; text-align: left; /*bodyでの指定を解除*/ background: transparent; } /*=====フッター=====*/ #footer { padding: 15px; background: transparent; } /*============================================================= * [5] Left Side (左サイド) =============================================================*/ /*=====左サイド=====*/ #left_side {} /*=====メニューリストの各タイトル全体の枠=====*/ .linkmenu { display: block; margin-left: 10px; font-size: 14px; } /*=====メニューリストの各タイトル全体の枠=====*/ table.menu_list {} /*=====サイドのメニューの各タイトル=====*/ td.menu_title { width: 120px; height: 38px; color: #cff; } /*同上:リンク*/ .menu_title a:link,.menu_title a:visited { display: block; width: 90px; margin-top: 0; padding: 4px 8px; color: #336; background: #cff; border-radius: 16px; -moz-border-radius: 16px; -webkit-border-radius: 16px; } .menu_title a:hover,.menu_title a:active { display: block; width: 90px; margin-top: 0; padding: 4px 8px; color: #336; background: #fff; border-radius: 16px; -moz-border-radius: 16px; -webkit-border-radius: 16px; } /*=====各メニューの枠=====*/ .MENU { position: absolute; visibility: hidden; z-index: 999; width: 200px; margin-top: 0; padding: 10px; font-size: 14px; color: #336; background: #9cc; border: 3px solid #cff; border-radius: 16px; -moz-border-radius: 16px; -webkit-border-radius: 16px; } /*=====各メニューの内容=====*/ .list_text { margin-top: 0; padding: 0 10px 10px; } /*=====各メニュー内のリスト(IEでは無効)=====*/ .list_text ul,.list_text ul li { margin: 0; padding: 0; } .list_text ul li ul li { margin-left: 0.5em; padding: 0; } /*=====各メニュー内下部のタイトル=====*/ .list_title { padding-top: 5px; text-align: center; color: #336; background: #cff; border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; } /*---カレンダー(table使用)---*/ #MENU1 {} #MENU1 table.calendar { margin: 0 auto; font-size: 12px; } /*カレンダーの年月の枠*/ td.calendar_month { text-align: center; } /*カレンダーの曜日の枠*/ td.weekday { text-align: center; } /*カレンダー個々の枠*/ td.cell { width: 18px; height: 18px; padding: 1px 1px; text-align: center; } /*---アーカイヴ---*/ #MENU2 {} /*---最新記事---*/ #MENU3 {} /*---最近のコメント---*/ #MENU4 {} /*---最近のトラックバック---*/ #MENU5 {} /*---カテゴリー---*/ #MENU6 {} /*--検索--*/ #MENU7 {} /*--検索フォーム --*/ form#search {} /*input[type=text]*/ input#s_word {} /*input[type=submit]*/ input#s_submit{} /*---リンク---*/ #MENU8 {} /*---フリースペース---*/ #MENU9 {} /*各フリースペースのタイトル*/ .f_t { font-weight: bold; } /*各フリースペーの内容*/ .f_c { margin: 10px 0; } /*---リコメンド(amazon)---*/ #MENU10 { text-align: center; } /*amazon1商品*/ .amazon { margin-top: 10px; font-size: 12px; } /*amazon商品画像*/ img.amazon_pict,a img.amazon_pict { border: 0; text-decoration: none; } /*amazon説明*/ .amazon_text { padding-top: 5px; text-align: left; } /*--プロフィール--*/ #MENU11 {} /*--その他(モバイル含む)--*/ #MENU12 {} /*モバイル(QRコード:タイトル部分は各フリースペースのタイトル=.f_t)*/ #qr { margin: 10px 0; text-align: center; } /*============================================================= * [6] Header (ヘッダー) =============================================================*/ /*=====ヘッダー=====*/ #header { width: 240px; /*狭過ぎる場合は指定なしでも可*/ height: auto; margin-left: 10px; margin-bottom: 20px; text-align: left; } /*ブログ名(色は[3]リンクの項にて指定)*/ h1 { font-size: 1.4em; margin-bottom: 5px; padding: 5px 16px; line-height: normal; color: #cff; background: #426579; border-radius: 16px; -moz-border-radius: 16px; -webkit-border-radius: 16px; } /*ブログ説明*/ #blog_description { margin-left: 15px; } /*============================================================= * [7] Conteiner,Main,Pager (コンテナ,メイン,ページャー) =============================================================*/ /*=====コンテナ(メイン・右サイドの枠)=====*/ #conteiner {} /*=====メイン(中央部分全体の枠)=====*/ #main {} /*---前後の記事---*/ #entry_navi { width: auto; height: auto; text-align: center; margin: 5px 0; color: #426579; } /*---ページ送り---*/ #pager { width: auto; height: auto; margin-bottom: 15px; text-align: center; } /*--ページ送りの個々の枠--*/ /*ページ送りの先頭ページ*/ span.first {} /*ページ送り:前のページ*/ span.prev {} /*ページ送り:次のページ*/ span.next {} /*ページ送り:最終ページ*/ span.last {} /*ページ送り:該当ページ*/ #pager span.current { margin-left: 6px; padding: 2px 5px; vertical-align: bottom; font-weight: bold; color: #336; background: #426579; border-radius: 16px; -moz-border-radius: 16px; -webkit-border-radius: 16px; } /*ページ送り:リンク*/ #pager span a:link,#pager span a:visited { margin-left: 5px; padding: 2px 6px; vertical-align: bottom; color: #9cc; background: #cff; border-radius: 16px; -moz-border-radius: 16px; -webkit-border-radius: 16px; } #pager span a:hover,#pager span a:active { margin-left: 5px; padding: 2px 6px; vertical-align: bottom; color: #336; background: #fff; border-radius: 16px; -moz-border-radius: 16px; -webkit-border-radius: 16px; } /*---トップへのリンク---*/ .page_top { width: auto; height: auto; margin-bottom: 15px; text-align: center; } /*----------------------------------------------------------- 上・下へのリンク(右上部●●)・右下の画像 *位置の変更はright,top,bottomの数値にて行えます。 *HTMLにて●,●のテキスト部分を他の文字・記号や画像に差し替えることも出来ます。 *filter: alpha:以下は透明度の指定なので不要なら削除可。 *不要ならHTML内の<!--上・下へのリンク-->〜<!--/上・下へのリンクここまで-->,<!--画像ここから--><!--/画像ここまで-->の部分を削除して下さい。 * 画像のサイズ変更はHTML内でimgのwidth,heightを同じ比率で変更して下さい。 -----------------------------------------------------------*/ #up_down { display: block; position: fixed; right: 5px; /*左側にする場合はleft:に変更*/ top: 5%; z-index: 999; font-size: 1.2em; filter: alpha(opacity=80); /* for IE */ -moz-opacity: 0.8; /* for Firefox(old) */ -webkit-opacity: 0.8; /* for Google Chrome */ opacity: 0.8; /*padding: 10px; for IE*/ } /*---右下の画像(width:250px;height:188px;)---*/ #image { display: block; position: fixed; right: 5px; /*左側にする場合はleft:に変更*/ bottom: 5px; z-index: 777; font-size: 1.2em; filter: alpha(opacity=95); /* for IE */ -moz-opacity: 0.95; /* for Firefox(old) */ -webkit-opacity: 0.95; /* for Google Chrome */ opacity: 0.95; } /*============================================================= * [8] Entry (記事) =============================================================*/ /*=====1記事の枠=====*/ .entry { width: auto; height: auto; margin: 0 auto 15px; padding: 0px 20px 15px; } /*記事のタイトル*/ .entry h2 { padding: 5px 0; margin-bottom: 5px; text-align: center; line-height: normal; font-size: 1.4em; background: #426579; border-radius: 16px; -moz-border-radius: 16px; -webkit-border-radius: 16px; } /*--記事本文(.jgm_entry_desc_mark)--*/ .entry_body { margin-top: 20px; } /*記事の続き*/ .entry_more { margin-top: 1em; padding-top: 1em; border-top: 1px dotted #426579; } /*JUGEMテーマ*/ .jugem_theme {} /*ソーシャルボタン*/ .service_button {} /*記事情報*/ .entry_state { color: #426579; } /*ログピのアイコン用(span.state_img)*/ .state_img { border:none; vertical-align:middle; } /*============================================================= * [9] Related Entry (関連記事エリア) =============================================================*/ /*=====関連する記事エリア=====*/ #related_entry { width: auto; height: auto; margin: 0 auto 15px; padding: 0 15px 10px; } /*--.main_title--*/ #related_title {} /*============================================================= * [10] Comment (コメントエリア) =============================================================*/ /*=====コメントエリア=====*/ #comment { width: auto; height: auto; margin: 0 auto 15px; padding: 0 15px 10px; } /*--.main_title--*/ #comment_title {} /*--1コメントの枠--*/ .comment_entry { margin-bottom: 15px; padding: 1em; border: 1px solid #426579; border-radius: 16px; -moz-border-radius: 16px; -webkit-border-radius: 16px; } /*--コメント情報 --*/ .comment_state {} /*--コメント本文 --*/ .comment_body {} /*--コメント投稿欄--*/ #comment_send_title {} /*--コメント投稿エリア --*/ .comment_send_form {} /*--コメント投稿フォーム --*/ form#comment_area {} /*input[type="text"] or input.input*/ #name,#email,#url {} textarea#description {} /*input[submit]*/ input#c_submit {} /*input[type=checkbox]*/ input#set_cookie {} /*============================================================= * [11] Trackback (トラックバックエリア) =============================================================*/ /*=====トラックバックエリア=====*/ #trackback { width: auto; height: auto; margin: 0 auto 15px; padding: 0 15px 10px; } /*--.main_title--*/ #trackback_title {} /*--TBのURL(見出し)--*/ #trackback_url {} /*input[type=text]*/ #tb_url {} /*TBしててきた記事--*/ #tb_title {} /*--TBしてきた記事のタイトル --*/ .trackback_name {} /*--TBしてきた記事の概要 --*/ .trackback_body {} /*--TBしてきたブログの情報(blog名・日時)--*/ .trackback_state {} /*============================================================= * [12] Profile (プロフィールエリア) =============================================================*/ /*=====プロフィールエリア=====*/ #profile{ width: auto; height: auto; margin: 0 auto 15px; padding: 10px 15px; } /*--.main_title--*/ #profile_title {} /*--プロフィールのニックネーム --*/ #profile_name {} /*--プロフィールの本文 --*/ #profile_body {} /*============================================================= * [13] Footer (フッター) =============================================================*/ /*=====フッター=====*/ #footer {} /*---著作権---*/ #copyright { height: auto; margin-bottom: 15px; } /*---JUGEM広告 (120px×240px)---*/ #pr { width: 120px; height: 240px; } #pr a { border: 0; text-decoration: none; } /*============================================================= * [14] Text,Elements (文中の装飾等) =============================================================*/ /*---水平線(IEでは色指定無効)---*/ hr { border: 0; height: 1px; background-color: #426579; } /*---引用など---*/ blockquote { margin: 1em; padding: 1em; border: 1px solid #426579; border-radius: 16px; -moz-border-radius: 16px; -webkit-border-radius: 16px; } pre,code { font-family: Consolas,"Courier New",Courier,monospace; font-size: medium; /*baseのfont-sizeがsmallのとき*/ color: #336; background: #cff; } pre { overflow: auto; margin: 1em; padding: 1em; } /*---記事内のリスト---*/ .entry ul li { margin-left: 1em; list-style-type: disc; } .entry ul ul li { list-style-type: circle; } .entry ol li { margin-left: 1em; list-style-type: decimal; } .entry ol ol li { list-style-type: upper-roman; } /*---記事内の画像---*/ img.pict { border: 0; padding: 5px; background: transparent; } /*============================================================= * [15] Form (フォーム) =============================================================*/ /*=====共通設定=====*/ input[type=text],input[type=submit],input[type=reset],input[type=password],input[type=file], input[checkbox],input#s_word,textarea,select,select optgroup,select option { font-family: "メイリオ","Meiryo","Trebuchet MS","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","MS Pゴシック","Osaka‐等幅",sans-serif; font-style: normal; font-size: small; color: #336; border: 1px solid #cff; background: #cff; } /*---テキストエリア---*/ textarea { width: 80%; height: 120px; padding: 8px; overflow: auto; border-radius: 16px; -moz-border-radius: 16px; -webkit-border-radius: 16px; } /*---テキスト入力欄(コメント投稿,トラックバックURL,検索)---*/ input[type=text],input[type=password],input[type=file] { width: 50%; padding-left: 8px; border-radius: 16px; -moz-border-radius: 16px; -webkit-border-radius: 16px; } /*--コメント投稿の各入力欄,トラックバックURL--*/ #description,input#name,input#email,input#url,input#tb_url { margin-bottom: 10px; } /*検索のテキスト入力欄*/ input#s_word { width: 60%; } /*--検索フォーム (テキスト入力欄・ボタン)--*/ form#s_search { display: inline; vertical-align: bottom; /* for IE */ } /*---テキストエリア,テキスト・検索テキスト入力欄:フォーカス時の配色(IEでは:focus無効)---*/ input[type=text]:hover,input[type=password]:hover,input[type=file]:hover,textarea:hover,input#s_word:hover, input[type=text]:focus,input[type=password]:focus,input[type=file]:focus,textarea:focus,input#s_word:focus { color: #336; background: #fff; border: 1px solid #fff; } /*---ボタン---*/ input[type=submit],input[type=reset] { padding: 0 2px; overflow: visible; /* for IE */ border-radius: 16px; -moz-border-radius: 16px; -webkit-border-radius: 16px; } /*--コメント送信ボタンとチェックボックス--*/ input#c_submit,input#set_cookie { vertical-align: baseline; } /*--検索ボタン--*/ input.s_submit {} /*---ボタン:フォーカス時の配色(IEでは:focus無効)---*/ input[type=submit]:hover,input[type=reset]:hover, input[type=submit]:active,input[type=reset]:active { background: #fff; border: 1px solid #fff; } /*---予備:選択メニュー---*/ select,select optgroup,select option { font-style: normal; color: #336; background: #cff; border: 1px solid #cff; } select optgroup,select option {border: 0;} /*============================================================= * [16] Floats Clearing (フロートの調整) =============================================================*/ .clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; } .clearfix:after { clear:both; content:' '; display:block; font-size:0; line-height:0; visibility:hidden; width:0; height:0 } /*============================================================= * Fin. =============================================================*/
高品質デザイン選び放題で、あなた好みのブログに。今すぐブログ作成!
今すぐ
無料ブログ
をはじめよう! ≫
ブログ作成
利用規約
|
プライバシーポリシー
|
推奨環境
|
会社概要
|
サイトマップ
Copyright © 2003-2021 株式会社メディアーノ All Rights Reserved.
ページの先頭へ↑