無料ブログをかんたん作成
無料ブログ作成ならJUGEM(ジュゲム)
ホーム
ブログ作成
ブログを書く
ブログを見る
無料ブログ作成
JUGEM PLUS お申し込み
サービス紹介
JUGEM(無料ブログ)
JUGEM PLUS(有料プラン)
ブログ機能一覧表
デザイン
公式ブログデザイン
PC版
スマートフォン版
ユーザー作成
ユーザー作成
JUGEM を楽しむ
投稿する・みんなとつながる
ブログテーマ
ブログのお題
その他のコンテンツ
芸能人・有名人のブログ
スペシャルインタビュー
JUGEM を楽しむ 一覧
サポート
管理者ページ・マニュアル
FAQ
お知らせ
新着情報
メンテナンス情報
障害情報
おすすめブログ紹介
このページでは JavaScript を使用しています。JavaScript を有効にしてください。
ホーム
>
ブログデザイン一覧
>
ユーザー作成テンプレート「utf」
>
テンプレートHTML・CSSについて
公開されているテンプレートのHTMLに{ad}タグがないものありますので、エラーが表示された場合は{ad}タグを追加してご利用ください。
テンプレートの利用について
弊社が著作権を所有する画像等以外のテンプレートに関する著作権は制作者にあります。弊社提供以外のブログサービスで利用した場合は、その都度制作者の方にご確認ください。
テンプレート名 :
Sky No.1
テンプレートイメージ表示ページへ戻る
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 type="text/javascript" language="JavaScript"> <!-- function ukon() { if(!document.getElementsByTagName) { return; }// var y = document.getElementsByTagName("div"); // for(var i = 0; i < y.length; i++)// { if(y[i].className == "menu_contents") { y[i].style.display = "none"; } } } function wtf(id) { if(!document.getElementsByTagName) { return false; } var x = this.document.getElementById(id).style; if(x.display == "none") { x.display = "block"; } else { x.display = "none"; } } --> </script> </head> <body onload="javascript:initval();javascript:ukon();" id="{index}{cid}{page}{month}{search}"> <!--ラッパーここから--> <div id="wrapper" class="clearfix"> <a name="top"></a> <!--ヘッダーここから--> <div id="header" class="clearfix"> <!-- パワードここから --> <div id="powered"> <a href="./manage/" title="管理者ページ">Admin</a> <a href="./?mode=rss" title="RSS1.0">RSS1.0</a> <a href="./?mode=atom" title="Atom0.3">Atom0.3</a> </div> <!--/パワードここまで--> <!--ブログタイトル・ブログ説明ここから--> <!-- BEGIN title --> <h1>{blog_name}</h1> <div id="blog_description"> {blog_description} </div> <!-- END title --> <!--/ブログタイトル・ブログ説明ここまで--> </div> <!--/ヘッダーここまで--> <!-- カレンダーここから --> <!-- BEGIN calendar --> <div id="calendar"> {calendar_horizontal} <!-- END calendar --> </div> <!-- /カレンダーここまで --> <!--コンテナ(両サイドとメインを囲む枠)ここから--> <div id="container" class="clearfix"> <!--左サイドここから--> <div id="left_side"> <!--検索ここから --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('site_search');" title="Search">Search</a></div> <div class="menu_contents" id="site_search"> Search This Site. <form method="get" action="./" class="search"> <input id="s_word" name="search" /> <input id="s_submit" type="submit" value="search" /> </form> </div> </div> <!--検索ここまで--> <!--最新記事ここから--> <!-- BEGIN latest_entry --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('latest');" title="Latest Entry">Latest Entry</a></div> <div class="menu_contents" id="latest"> {latest_entry_list} </div> </div> <!-- END latest_entry --> <!--/最新記事ここまで--> <!--最近のコメントここから--> <!-- BEGIN recent_comment --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('re_comment');" title="Recent Comment">Recent Comment</a></div> <div class="menu_contents" id="re_comment"> {recent_comment_list} </div> </div> <!-- END recent_comment --> <!--/最近のコメントここまで--> <!--最近のトラックバックここから--> <!-- BEGIN recent_trackback --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('re_trackback');" title="Recent Trackback">Recent Trackback</a></div> <div class="menu_contents" id="re_trackback"> {recent_trackback_list} </div> </div> <!-- END recent_trackback --> <!--/最近のトラックバックここまで--> <!--カテゴリーここから--> <!-- BEGIN category --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('categories');" title="Categories">Categories</a></div> <div class="menu_contents" id="categories"> {category_list} </div> </div> <!-- END category --> <!--/カテゴリーここまで--> <!--アーカイヴここから--> <!-- BEGIN archives --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('archives');" title="Archives">Archives</a></div> <div class="menu_contents" id="archives"> {archives_list2ex} </div> </div> <!-- END archives --> <!--/アーカイヴここまで--> <!--プロフィールここから--> <!-- BEGIN profile --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('prof');" title="Profile">Profile</a></div> <div class="menu_contents" id="prof"> {user_list} <ul> <li>書いた記事数:{all_entry_count}</li> <li>最後に更新した日:{last_entry_date}</li> </ul> </div> </div> <!-- END profile --> <!--/プロフィールここまで--> <!--モバイルここから --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('mobile');" title="Mobile">Mobile</a></div> <div class="menu_contents" id="mobile"> {site_qrcode} </div> </div> <!--/モバイルここまで --> </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_date"> {entry_day}/{entry_month}/{entry_year} {entry_eng_week} {entry_time_only} </div> <!--記事本文 --> <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}) 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 --> <!-- /記事ここまで --> <br class="clear" /> <!-- 関連する記事エリアここから --> <!-- 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> <div id="trackback_url" class="sub_title">Trackback URL</div> <input type="text" id="t_url" value="{trackback_url}" /> <!-- BEGIN trackback --> <div id="trackbacks_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 --> </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="このページのトップへ">▲ TOP ▲</a> </div> <!-- /トップへのリンクここまで --> </div> <!--/メイン(中央部分)ここまで--> <!--右サイドここから--> <div id="right_side"> <!-- いま表示している記事ここから --> <!-- BEGIN selected_entry --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('s_entries');" title="Selected Entries">Selected Entries</a></div> <div class="menu_contents" id="s_entries"> {selected_entry_list} </div> </div> <!-- END selected_entry --> <!--/いま表示している記事ここまで--> <!--リンクここから --> <!-- BEGIN link --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('links');" title="Links">Links</a></div> <div class="menu_contents" id="links"> {link_list} </div> </div> <!-- END link --> <!--/リンクここまで--> <!--フリースペースここから--> <!-- BEGIN freespace1 --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('fs1');" title="{freespace_title1}">{freespace_title1}</a></div> <div class="menu_contents" id="fs1"> {freespace_contents1} </div> </div> <!-- END freespace1 --> <!-- BEGIN freespace2 --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('fs2');" title="{freespace_title2}">{freespace_title2}</a></div> <div class="menu_contents" id="fs2"> {freespace_contents2} </div> </div> <!-- END freespace2 --> <!-- BEGIN freespace3 --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('fs3');" title="{freespace_title3}">{freespace_title3}</a></div> <div class="menu_contents" id="fs3"> {freespace_contents3} </div> </div> <!-- END freespace3 --> <!-- BEGIN freespace4 --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('fs4');" title="{freespace_title4}">{freespace_title4}</a></div> <div class="menu_contents" id="fs4"> {freespace_contents4} </div> </div> <!-- END freespace4 --> <!-- BEGIN freespace5 --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('fs5');" title="{freespace_title5}">{freespace_title5}</a></div> <div class="menu_contents" id="fs5"> {freespace_contents5} </div> </div> <!-- END freespace5 --> <!--/フリースペースここまで--> <!--リコメンドここから --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('amazon');" title="Recommend">Recommend</a></div> <!--amazon全体ここから--> <div class="menu_contents" id="amazon"> <!--amazon単品ここから--> <!-- BEGIN amazon --> <div class="amazon"> <a href="{amazon_url}" target="_blank"> <img border="0" src="{amazon_ImageUrlSmall}" alt="{amazon_ProductName}" class="amazon_pict" /> </a> <br /> <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--> <!-- END amazon --> </div><!--amazon単品ここまで--> </div> <!--/amazon全体とリコメンドここまで--> </div> <!--/右サイドここまで--> </div> <!--コンテナ(両サイドとメインを囲む枠)ここまで--> <!--フッターここから--> <div id="footer" class="clearfix"> <!--著作権表示ここから--> <div id="copyright"> {copyright} <br /> Photograph by <a href="http://neo-himeism.net/" title="NEO HIMEISM" target="_blank">NEO HIMEISM</a> <br /> Template "Sky No.1" 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広告ここから --> <!-- BEGIN jugem_ad --> <div id="pr"> {ad} </div> <!-- END jugem_ad --> <!--/JUGEM広告ここまで--> </div> <!--/フッターここまで--> <a id="bottom" name="bottom"></a> <!-- 上・下へのリンク --> <div id="up_down"> <div> <a href="#top" title="上へ">▲</a> </div> <div> <a href="#bottom" title="下へ">▼</a> </div> </div> <!-- /上・下へのリンクここまで/ --> </div> <!--/ラッパーここまで--> </body> </html>
CSS
@charset "EUC-JP"; /* ---------------------------------------- 作成日:2012.07.06 テンプレート名: Sky No.1 by Emmanuel (http://frais76.jugem.jp) 取扱説明書(http://frais76.jugem.jp/?eid=205) ※テンプレート、素材共にカスタマイズの有無に関係なく再配布厳禁とさせて頂きます。 ※フッター内の著作権表示の削除も禁止とさせて頂きます。 CSS目次 [1] Reset (ブラウザの初期設定のリセット) [2] General Structure and Styles (総合) [3] Layout (レイアウト) [4] Link,H,Title (リンク,見出し等) [5] header (ヘッダー) [6] Left_Side (左サイド) [7] Right_Side (右サイド) [8] Entry (記事) [9] Related Entry (関連記事エリア) [10] Comment (コメントエリア) [11] Trackback (トラックバックエリア) [12] Profile (プロフィールエリア) [13] Footer (フッター) [14] Pager (ページャー) [15] Text,Elements (文中の装飾等) [16] Form (フォーム) [17] Floats Clearing (フロートの調整) ---------------------------------------- */ /*============================================================= * [1] Reset (ブラウザの初期設定のリセット) =============================================================*/ * {margin:0px; padding:0px; zoom:1;} 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; } /*見出し*/ h1,h2,h3,h4,h5,h6 {font-size:100%; font-weight: normal; 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;} /*============================================================= * [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%; height: 100%; text-align: center; /*wrapperを中央に配置するため*/ font-size: 10pt; line-height: 1.7em; /*for IE*/ color: #fefefe; background: #184656 url("http://img-cdn.jg.jugem.jp/63b/359049/20120704_165929.jpg") repeat-y fixed 0 0; font-family: Georgia, "メイリオ", "Meiryo", Verdana, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", sans-serif; scrollbar-arrow-color: #184656; /*IE用スクロールバーの設定 */ scrollbar-face-color: #699; scrollbar-3dlight-color: #184656; scrollbar-darkshadow-color: #184656; scrollbar-highlight-color: #699; scrollbar-shadow-color: #699; scrollbar-track-color: #184656; } /*Georgiaの直後に"MS P明朝"などを入れるとserifで揃います。*/ /*============================================================= * [3] Layout (レイアウト) * borderなしの場合は(A)メインのwidth+(A)メインの左右のmargin+左サイド(B)のwidth+(C)右サイドのwidth=100%になるようにする。 * borderありの場合は(A)メイン,左サイド(B),(C)右サイドのwithやmarginで調整して合計が99-98%より少なくなるようにする(100%ではIEなどでNG)。 * HTMLでの#main,#left-side,#right-sideの記述順序を変更しないこと。 =============================================================*/ /*=====ページ全体=====*/ #wrapper { width: 960px; /*全体の幅はここで変更*/ margin: 0 auto; padding: 10px 0; } /*=====ヘッダー=====*/ #header { height: auto; padding: 10px 15px; } /*=====カレンダー=====*/ #calendar { margin-bottom: 15px; } /*=====コンテナ(メイン・両サイドの枠)=====*/ #container { width: 100%; margin: 0 auto; padding: 10px 0 15px; text-align: left; /*bodyでの中央揃えを解除*/ } /*=====(A)メイン(中央部分全体の枠)=====*/ #main { float: left; width: 54%; margin: 0 2%; } /*=====(B)左サイド =====*/ #left_side { float: left; width: 21%; margin: 0; } /*=====(C)右サイド =====*/ #right_side { float: right; width: 21%; margin: 0; } /*=====フッター=====*/ #footer { clear: both; height: auto; padding: 15px; text-align: left; font-size: 9pt; background: transparent url("http://img-cdn.jg.jugem.jp/63b/359049/20120520_57521.png") repeat scroll 0 0; border: 4px double #699; } /*============================================================= * [4] Link,H,Title (リンク,見出し等:aについてはResetも参照のこと) =============================================================*/ /*=====基本=====*/ a:link {color: #cff;} /*cff,9cc,6cc*/ a:visited {color: #9cc;} a:hover {color: #184656;} a:active {color: #184656;} /*=====ヘッダー(詳細はヘッダーの項にて設定)=====*/ /*---ブログタイトル---*/ h1,h1 a:link,h1 a:visited {color: #cff;} /*or#f0ffff,or#399*/ h1 a:hover,h1 a:active {color: #184656;} /*ブログ説明*/ #blog_description {color: #cff;} /*---パワード---*/ #powered a:link,#powered a:visited {color: #699;} #powered a:hover,#powered a:active {color: #184656;} /*---カレンダー---*/ #calendar { color: #699; font-weight: bold; } #calendar a {} /*=====記事タイトル(詳細は記事の項にて設定)=====*/ h2,h2 a:link,h2 a:visited {color: #cff;} h2 a:hover,h2 a:active {color: #184656;} /*---記事内のリンク--*/ .entry_body a,.entry_more a {} /*=====サイドのメニューの各タイトル(詳細は左サイドの項にて設定)=====*/ .menu_title,.menu_title a { font-weight: bold; text-transform: uppercase; /*全て大文字化*/ } .menu_title,.menu_title a:link,.menu_title a:visited {color: #cff;} .menu_title a:hover,.menu_title a:active {color: #184656;} /*=====各メニュー内のリンク=====*/ .menu_area a:link {} .menu_area a:visited {} .menu_area a:hover,.MENU a:active {} /*=====ページャー(前後の記事,ページ送りは[14]にて後述)=====*/ /*---前後の記事---*/ #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: #184656;} /*---上・下へのリンク---*/ #up_down a:link,#up_down a:visited {color: #699;} #up_down a:hover,#up_down a:active {color: #184656;} /*=====画像=====*/ a img {border: 0;text-decoration: none;} /*=====関連する記事,コメント,トラックバック、プロフィール各エリアのタイトル=====*/ .main_title { margin-bottom: 5px; padding: 5px; text-align: center; font-weight: bold; text-transform: uppercase; font-size: 1.3em; font-weight: bold; color: #cff; /*ブログ、記事のタイトルと同色*/ } /*---コメント投稿欄の見出し,トラックバックのURL,トラックバックしてきた記事,プロフィールのニックネーム---*/ .sub_title { padding: 5px 0; text-align: left; font-weight: bold; text-transform: uppercase; font-size: 1.1em; font-weight: bold; color: #cff; /*ブログ、記事のタイトルと同色*/ } /*============================================================= * [5] Header (ヘッダー) =============================================================*/ /*=====ヘッダー=====*/ #header {} /*---ブログ名(色は[4]リンクの項にて指定)---*/ h1 { clear: both; padding: 5px; font-size: 1.4em; font-weight: bold; line-height: normal; /*for IE*/ } /*ブログ説明*/ #blog_description {} /*---パワード---*/ #powered { width: 20%; float: left; text-align: left; } /*============================================================= * [6] Left_Side (左サイド) =============================================================*/ /*=====左サイド=====*/ #left_side {} /*-----各メニューの枠(左右共通)-----*/ .menu_area { margin: 0 0 15px; padding: 10px; background: transparent url("http://img-cdn.jg.jugem.jp/63b/359049/20120520_57521.png") repeat scroll 0 0; border: 4px double #699; } /*-----各メニューのタイトル(左右共通)-----*/ .menu_title { margin: 0; text-align: center; } /*-----各メニューの内容(左右共通)-----*/ .menu_contents { margin-top: 5px; padding: 0 5px; font-size: 9pt; } /*-----各メニューのリスト(左右共通)-----*/ .menu_contents ul li { margin-left: 0; } .menu_contents ul li ul li { margin-left: 0.5em; } /*---検索---*/ #site_search {} /*検索フォーム*/ form#search {} /*検索テキスト入力欄input[text]*/ input#s_word {} /*検索ボタンinput[type=submit]*/ input#s_submit {} /*---最新記事---*/ #latest {} /*---最近のコメント---*/ #re_comment {} /*---最近のトラックバック---*/ #re_trackback {} /*---カテゴリー---*/ #categories {} /*---アーカイヴ---*/ #archives {} /*---プロフィール---*/ #prof {} /*---モバイル(QRコード)---*/ #mobile { text-align: center; } /*============================================================= * [7] Right_Side (右サイド) =============================================================*/ /*=====右サイド=====*/ #right_side {} /*---いま表示している記事---*/ #s_entries {} /*---リンク---*/ #links {} /*---フリースペース---*/ /*フリースペース,リコメンド,モバイル*/ #fs1,#fs2,#fs3,#fs4,#fs5,#amazon,#mobile { padding-top: 5px; } /*---リコメンド---*/ #amazon {} .amazon { text-align: center; } .amazon_pict {} /*amazon説明のみ左寄せ*/ .amazon_text { margin: 5px 0; text-align: left; } /*============================================================= * [8] Entry (記事) =============================================================*/ /*=====1記事の枠=====*/ .entry { width: auto; height: auto; padding: 20px; margin-bottom: 15px; background: transparent url("http://img-cdn.jg.jugem.jp/63b/359049/20120520_57521.png") repeat scroll 0 0; border: 4px double #699; } /*記事のタイトル*/ .entry h2 { padding: 0 5px 5px; text-align: center; font-size: 1.4em; line-height: normal; /*for IE*/ } /*投稿日時*/ .entry_date { text-align: center; color: #cff; /*タイトルリンク色と同色*/ } /*--記事本文(.jgm_entry_desc_mark)--*/ .entry_body { margin-top: 15px; padding-top:15px; border-top: 1px solid #699; } /*記事の続き*/ .entry_more { margin-top: 1em; padding-top: 1em; border-top: 1px dotted #699; } /*JUGEMテーマ*/ .jugem_theme {} /*ソーシャルボタン(規定)*/ .service_button { margin:25px 0; padding:0px; } /*記事情報*/ .entry_state {} /*ログピのアイコン用*/ .state_img { border: none; vertical-align: middle; } /*============================================================= * [9] Related Entry (関連記事エリア) =============================================================*/ /*=====(共通)関連する記事エリア,コメントエリア,トラックバックエリア,プロフィールエリアの枠=====*/ #related_entry,#comment,#trackback,#profile { width: auto; height: auto; padding: 15px; margin-bottom: 15px; background: transparent url("http://img-cdn.jg.jugem.jp/63b/359049/20120520_57521.png") repeat scroll 0 0; border: 4px double #699; } /*--.main_title--*/ #related_title {} /*============================================================= * [10] Comment (コメントエリア) =============================================================*/ /*=====コメントエリア=====*/ #comment {} /*--.main_title--*/ #comment_title {} /*--1コメントの枠--*/ .comment_entry { margin-bottom: 15px; padding: 1em; border: 1px dotted #699; } /*--コメント情報 --*/ .comment_state { margin-bottom: 5px; padding: 0; } /*--コメント本文 --*/ .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 {} /*--TB記事のタイトル .main_title--*/ .trackback_name { font-weight: bold; } /*--TBのURL(見出し)--*/ #trackback_url {} /*input[type=text]*/ #tb_url {} /*TBしててきた記事--*/ #tb_title {} /*--TBしてきた記事のタイトル --*/ .trackback_name {} /*--TBしてきた記事の概要 --*/ .trackback_body {} /*--TBしてきたブログの情報(blog名・日時)--*/ .trackback_state { margin-bottom: 5px; } /*============================================================= * [12] Profile (プロフィールエリア) =============================================================*/ /*=====プロフィールエリア=====*/ #profile{} /*--.main_title--*/ #profile_title {} /*--プロフィールのニックネーム --*/ #profile_name {} /*--プロフィールの本文 --*/ #profile_body {} /*============================================================= * [13] Footer (フッター) =============================================================*/ /*=====フッター=====*/ #footer {} /*---著作権---*/ #copyright { width: auto; height: auto; margin-bottom: 1em; } /*---JUGEM広告(120px×240px)---*/ #pr { width: auto; height: auto; padding: 0; /*for IE*/ margin: 0; /*for IE*/ } #pr a { border: 0; text-decoration: none; } /*============================================================= * [14] Pager (ページャー) =============================================================*/ /*---前後の記事---*/ #entry_navi { margin: 0 0 15px 0; text-align: center; } /*---ページ送り---*/ #pager { width: auto; height: auto; margin-bottom: 15px; text-align: center; } /*ページ送り:該当ページ*/ span.current { margin-left: 5px; padding: 3px 6px; /*vertical-align: top; for Georgia,fontにもよる*/ color: inherit; background: transparent url("http://img-cdn.jg.jugem.jp/63b/359049/20120704_166789.gif") repeat scroll center top; border: 4px double #699; } /*ページ送り:リンク*/ #pager span a:link,#pager span a:visited { margin-left: 5px; padding: 3px 6px; background: transparent url("http://img-cdn.jg.jugem.jp/63b/359049/20120520_57521.png") repeat scroll 0 0; border: 4px double #699; } #pager span a:hover,#pager span a:active { margin-left: 5px; padding: 3px 6px; color: #fefefe; background: transparent url("http://img-cdn.jg.jugem.jp/63b/359049/20120704_166789.gif") repeat scroll center top; border: 4px double #699; } /*--ページ送りの個々の枠総合--*/ #pager span {} /*ページ送りの先頭ページ*/ span.first {} /*ページ送り:前のページ*/ span.prev {} /*ページ送り:次のページ*/ span.next {} /*ページ送り:最終ページ*/ span.last {} /*---トップへのリンク---*/ .page_top { width: auto; height: auto; text-align: center; font-weight: bold; } /*----------------------------------------------------------- 上・下へのリンク(右上部▲▼)・画像 *位置の変更はright,top,bottomの数値にて行えます。 *HTMLにて▲▼のテキスト部分を他の文字・記号や画像に差し替えることも出来ます。 *filter: alpha:以下は透明度の指定なので不要なら削除可。 *不要ならHTML内の<!--上・下へのリンク-->〜<!--/上・下へのリンクここまで-->の部分を削除して下さい。 -----------------------------------------------------------*/ #up_down { display: block; position: fixed; right: 5px; /*左側にする場合はleft:に変更*/ top: 5%; z-index: 777; line-height: normal; font-size: 1.5em; filter: alpha(opacity=50); /* for IE */ -moz-opacity: 0.5; /* for Firefox(old) */ -webkit-opacity: 0.5; /* for Google Chrome */ opacity: 0.5; } /*============================================================= * [15] Text,Elements (文中の装飾等) =============================================================*/ /*---水平線(IEでは色指定無効)---*/ hr { border: 0; height: 1px; background-color: #699; } /*---引用など---*/ blockquote { margin: 1em; padding: 1em; border: 1px dotted #699; } pre,code { /*font-size: 1.1em; 読み難い場合*/ font-family: "Courier New", Courier, Consolas, "Lucida Console", monospace; background: #699; } pre { overflow: auto; margin: 1em; padding: 1em; } /*---記事内のリスト---*/ .entry ul, .entry ol { line-height: 1.6em; } .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; } /*============================================================= * [16] 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", Verdana, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", sans-serif; font-style: normal; font-size: small; color: #699; background: transparent; border: 1px solid #699; } /*---テキストエリア---*/ textarea { width: 80%; height: 120px; overflow: auto; } /*---テキスト入力欄(コメント投稿,トラックバックURL,検索)---*/ input[type=text],input[type=password],input[type=file] { width: 60%; } /*--コメント投稿の各入力欄,トラックバックURL--*/ #description,input#name,input#email,input#url,input#tb_url { margin-bottom: 10px; } /*--検索フォーム (テキスト入力欄・ボタン)*/ form#search { display: inline; vertical-align: bottom; /*forIE--*/ } /*検索のテキスト入力欄*/ input#s_word { width: 60%; } /*---テキストエリア,テキスト・検索テキスト入力欄フォーカス時の配色(IEでは:focus無効)---*/ input[type=text]:hover,input[type=password]:hover,input[type=file]:hover,textarea:hover,input#s_word:hover,input[type=text]:active,input[type=password]:active,input[type=file]:active,textarea:active,input#s_word:active, input[type=text]:focus,input[type=password]:focus,input[type=file]:focus,textarea:focus,input#s_word:focus { color: azure; /*=#f0ffff*/ border: 1px solid azure; background: transparent url("http://img-cdn.jg.jugem.jp/63b/359049/20120520_57521.png") repeat scroll 0 0; } /*---ボタン---*/ input[type=submit],input[type=reset] { padding: 0 2px; overflow: visible; /* for IE */ } /*--コメント送信ボタンとチェックボックス--*/ 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, input[type=submit]:focus,input[type=reset]:focus { color: azure; border: 1px solid azure; background: transparent url("http://img-cdn.jg.jugem.jp/63b/359049/20120520_57521.png") repeat scroll 0 0; } /*---予備:選択メニュー---*/ select,select optgroup,select option { font-style: normal; color: azure; background: #699; border: 1px solid #699; filter: alpha(opacity=70); /* for IE */ -moz-opacity: 0.7; /* for Firefox(old) */ -webkit-opacity: 0.7; /* for Google Chrome */ opacity: 0.7; } select optgroup,select option {border: 0;} /*============================================================= * [17] 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.
ページの先頭へ↑