無料ブログをかんたん作成
無料ブログ作成ならJUGEM(ジュゲム)
ホーム
ブログ作成
ブログを書く
ブログを見る
無料ブログ作成
JUGEM PLUS お申し込み
サービス紹介
JUGEM(無料ブログ)
JUGEM PLUS(有料プラン)
ブログ機能一覧表
デザイン
公式ブログデザイン
PC版
スマートフォン版
ユーザー作成
ユーザー作成
JUGEM を楽しむ
投稿する・みんなとつながる
ブログテーマ
ブログのお題
その他のコンテンツ
芸能人・有名人のブログ
スペシャルインタビュー
JUGEM を楽しむ 一覧
サポート
管理者ページ・マニュアル
FAQ
お知らせ
新着情報
メンテナンス情報
障害情報
おすすめブログ紹介
このページでは JavaScript を使用しています。JavaScript を有効にしてください。
ホーム
>
ブログデザイン一覧
>
ユーザー作成テンプレート「utf」
>
テンプレートHTML・CSSについて
公開されているテンプレートのHTMLに{ad}タグがないものありますので、エラーが表示された場合は{ad}タグを追加してご利用ください。
テンプレートの利用について
弊社が著作権を所有する画像等以外のテンプレートに関する著作権は制作者にあります。弊社提供以外のブログサービスで利用した場合は、その都度制作者の方にご確認ください。
テンプレート名 :
Water 3C Foldable 2
テンプレートイメージ表示ページへ戻る
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"> <a name="top"></a> <!--ヘッダーここから--> <div id="header"> <!-- BEGIN title --> <h1>{blog_name}</h1> <div id="blog_description"> {blog_description} </div> <!-- END title --> </div> <!--/ヘッダーここまで--> <!-- カレンダーここから --> <!-- BEGIN calendar --> <div id="calendar"> {calendar_prev_yearmonth} <a href="./?month={calendar_prev_yearmonth}" title="{calendar_prev_yearmonth}"><<</a> {calendar_horizontal_only_addzero} <a href="./?month={calendar_next_yearmonth}" title="{calendar_next_yearmonth}">>></a> {calendar_next_yearmonth} </div> <!-- END calendar --> <!-- /カレンダーここまで --> <!--左サイドここから--> <div id="left_side"> <!--プロフィールここから--> <!-- BEGIN profile --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('profile_side');">Profile</a></div> <div class="menu_contents" id="profile_side"> {user_list} <ul><li>書いた記事数:{all_entry_count}</li> <li>最後に更新した日:{last_entry_date}</li></ul> </div> </div> <!-- END profile --> <!--/プロフィールここまで--> <!--最新記事ここから--> <!-- BEGIN latest_entry --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('latest');">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');">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');">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');">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');">Archives</a></div> <div class="menu_contents" id="archives"> {archives_list2ex} </div> </div> <!-- END archives --> <!--/アーカイブここまで--> <!-- パワードここから --> <!-- powered --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('others');">Others</a></div> <div class="menu_contents" id="others"> <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> </div> </div> <!-- /powered --> <!--/パワードここまで--> <!--モバイルここから --> <!-- moblie --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('mobile');">Mobile</a></div> <div class="menu_contents" id="mobile"> {site_qrcode} </div> </div> <!-- /moblie --> <!--/モバイルここまで --> </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}) {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"> RELATED ENTRIES </div> {related_entry_list} </div> <!-- END related_entry --> <!--/関連する記事エリアここまで --> <!-- コメントエリアここから --> <!-- BEGIN comment_area --> <a name="comments"></a> <div id="comment"> <div id="comment_title"> COMMENT </div> <!--コメントここから--> <!-- BEGIN comment --> <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> <!-- END comment --> <!--/コメントここまで--> <!--コメント投稿欄ここから --> <div id="comment_send_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">TRACKBACK</div> <div id="trackback_url">TRACKBACK URL</div> <input type="text" id="tb_url" value="{trackback_url}" /> <!-- BEGIN trackback --> <div id="tb_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"> PROFILE </div> <div id="profile_name"> {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('selected');">Selected Entries</a></div> <div class="menu_contents" id="selected"> {selected_entry_list} </div> </div> <!-- END selected_entry --> <!--/いま表示している記事ここまで--> <!--検索ここから --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('site_search');">Search</a></div> <div class="menu_contents" id="site_search"> Search This Site.<br /> <form method="get" action="./"> <table cellpadding="0" cellspacing="0" border="0"> <tr valign="middle"> <td> <input id="search" name="search" class="search" /> </td> <td> <input id="s_submit" type="submit" value="search" /> </td> </tr> </table> </form> </div> </div> <!--検索ここまで--> <!--リンクここから --> <!-- BEGIN link --> <div class="menu_area"> <div class="menu_title"><a href="javascript:wtf('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');">{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');">{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');">{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');">{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');">{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');">Recommend</a></div> <!--アマゾン商品ここから--> <div class="menu_contents" id="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> <!--アマゾン商品説明--> <div class="amazon_text"> [ {amazon_Creator} ]<br /> {amazon_comment} </div> </div> <!-- END amazon --> <!--/アマゾン単品ここまで--> </div> <!--/アマゾン商品ここまで--> </div> <!--/リコメンドここまで--> <!--JUGEM広告ここから --> <!-- BEGIN jugem_ad --> <div class="menu_area"> <div class="menu_title" id="jad">PR</div> <div id="jad_area"> {ad} </div> </div> <!-- END jugem_ad --> <!--/JUGEM広告ここまで--> </div> <!--/右サイドここまで--> <!--フッターここから--> <div id="footer"> <!--著作権表示ここから--> <div id="copyright"> {copyright} <br /> Photograph by 2jenn. <br /> Template "Water 3C Foldable 2" by <a href="http://frais76.jugem.jp/" title="† Emmanuel †" target="_blank">† Emmanuel †</a>. <br /> <div id="poweredby"> Powered by <a href="http://jugem.jp/" title="JUGEM" target="_blank">JUGEM</a>. </div> <!--/著作権表示ここまで--> </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.06.20(2012.07.06微修正) テンプレート名: Water 3C Foldable 2 by Emmanuel (http://frais76.jugem.jp) Water 3C Foldable 取扱説明書 (http://frais76.jugem.jp/?eid=180) ※テンプレート,使用画像共に再配布禁止とさせて頂きます。 ※著作権表示は削除しないで下さい。 CSS目次 [1] ブラウザの初期設定のリセット [2] 全体の基本設定 [3] リンク [4] 各エリアの見出し等 [5] レイアウト ほか 1 [6] レイアウト ほか 2 [7] フォーム [8] その他 ---------------------------------------- */ /*============================================================= * [1] ブラウザの初期設定のリセット =============================================================*/ * {margin:0px; padding:0px; zoom:1;} html,body,div,a {margin:0px; padding:0px;} /*見出し*/ 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;} /*区切線*/ hr {border:0; clear:both; margin:1em 0;} /*改行*/ br.clear {clear: both;} /*============================================================= * [2] 全体の基本設定 =============================================================*/ html,body { width: 100%; text-align: center; /*wrapperを中央に配置するため*/ font-size: small; line-height: 1.5em; /*for IE*/ color: #eef; background: #9798ca url("http://img-cdn.jg.jugem.jp/63b/359049/20120617_133820.jpg") no-repeat fixed center top; background-size: cover; font-family: "Georgia","メイリオ","Meiryo","Trebuchet MS","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","MS Pゴシック","Osaka‐等幅",sans-serif; line-height:1.6em; scrollbar-arrow-color: #336; /* IE用スクロールバーの設定 */ scrollbar-face-color: #9798ca; scrollbar-3dlight-color: #9798ca; scrollbar-darkshadow-color: #9798ca; scrollbar-highlight-color: #336; scrollbar-shadow-color: #336; scrollbar-track-color: #9798ca; } /*個別のカテゴリページ(URLが ./?cid等となっている場合)に 記事の本文(.entry-body)と記事の続き(.entry-more)を非表示(display: none;)にする。 {day}は記事数が少ないので入れていません。*/ 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; } /*============================================================= * [3] リンク ※下線を表示したい場合はリセットの項にてtext-decoration: underline;と指定。 =============================================================*/ /*=====リンクの基本色=====*/ a:link {color: #003;} a:visited {color: #000036;} a:hover {color: #303;} a:active {color: #303;} /*-----ブログのタイトル-----*/ h1,h1 a,h1 a:link,h1 a:visited {color:#003;} h1 a:hover,h1 a:active {color: #303;} /*---ブログ説明をブログのタイトルと同色に---*/ #description {color: #003;} /*-----記事タイトル-----*/ h2,h2 a,h2 a:link,h2 a:visited {color:#003;} h2 a:hover,h2 a:active {color: #303;} /*---記事の日付をタイトルと同色に---*/ .entry_date {color: #003;} /*-----両サイドメニュー-----*/ #left_side a, #right_side a {} #left_side a:link, #right_side a:link {} #left_side a:visited, #right_side a:visited {} #left_side a:hover, #right_side a:hover {} #left_side a:active, #right_side a:active {} /*-----カレンダー-----*/ #calendar a {font-weight:bolder;} #calendar a:link, #calendar a:visited {} #calendar a:hover, #calendar a:active {} /*-----上・下へのリンク-----*/ #up_down a {text-decoration: none;} /*============================================================= * [4] 各エリアの見出し等 =============================================================*/ /*======ブログ名=====*/ h1 { padding: 5px; line-height: normal; text-align: center; font-size: 1.4em; font-weight: bold; } /*-----ブログ説明-----*/ #blog_description { margin-top: 5px; } /*=====記事タイトル=====*/ h2 { padding: 0 5px 5px; line-height: normal; text-align: center; font-size: 1.4em; font-weight: bold; } /*=====関連する記事、コメント、トラックバック、プロフィール各エリアのタイトル=====*/ #related_title, #comment_title, #trackback_title, #profile_title { color: #003; /*ブログ、記事のタイトルと同色*/ font-size: 1.4em; font-weight: bold; margin-bottom: 5px; padding: 5px; line-height: normal; text-align: center; } /*-----コメント投稿欄、トラックバックURL、トラックバックの各見出し-----*/ #comment_send_title, #trackback_url, #tb_title, #profile_name { color: #003; /*ブログ、記事のタイトルと同色*/ font-size: 1.2em; font-weight: bold; padding: 5px 0; line-height: normal; text-align: left; } /*=====メニューのタイトル=====*/ .menu_title { margin: 0; padding: 5px 0; font-size: 1em; font-weight: bold; line-height: normal; text-transform: uppercase; /*削除すれば小文字になります*/ text-align: center; color: #003; /*for JUGEM PR;リンク時と同色*/ } /*============================================================= * [5] レイアウト ほか 1 * 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: 950px; /*全体の幅はここで変更*/ margin: 0 auto; padding: 10px 0; } /*=====ヘッダー=====*/ #header { height: auto; margin-bottom: 10px; padding: 15px; border: 1px solid #9798ca; } /*=====カレンダー=====*/ #calendar { clear: both; padding: 5px; font-size: larger; } /*=====(A)メイン・中央部分全体の枠=====*/ #main { float: left; text-align: left; width: 54%; margin: 10px 1.5% 15px; /* margin-top,margin-bottomをleft-side,right-sideと同じに*/ } /*=====(B)左サイド=====*/ #left_side { float: left; text-align: left; width: 21%; margin: 10px 0 15px; } /*=====(C)右サイド=====*/ #right_side { float: right; text-align: left; width: 21%; margin: 10px 0 15px; } /*=====フッター=====*/ #footer { clear: both; width: 100%; height: auto; padding: 10px 0; border: 1px solid #9798ca; } /*============================================================= * [6] レイアウト ほか 2 =============================================================*/ /*=====記 事=====*/ /*前後の記事 */ #entry_navi { margin: 0 0 15px 0; text-align: center; } /*---1記事の枠---*/ .entry { padding: 20px; margin-bottom: 10px; border: 1px solid #9798ca; } /*投稿日時*/ .entry_date { text-align: center; margin-bottom: 15px; } /*記事本文(記事の続きより前のテキスト)*/ .entry_body,.jgm_entry_desc_mark {} /*記事の続き*/ .entry_more { margin-top: 1em; padding-top: 1em; border-top: 1px dotted #336; } /*ソーシャルボタン(規定)*/ .service_button { margin:25px 0; padding:0px; } /*記事情報*/ .entry_state {} /*=====関連する記事、コメントアリア、TBエリア、プロフィール=====*/ /*-----各エリアの枠-----*/ #related_entry,#comment,#trackback,#profile { padding: 15px; margin-bottom: 10px; border: 1px solid #9798ca; } /*---1コメントの枠---*/ .comment_entry { margin-bottom: 15px; padding: 1em; border: 1px dotted #336; } /*コメント情報*/ .comment_state { margin-bottom: 5px; padding: 0; } /*コメント本文*/ .comment_body {} /*TB記事のタイトル */ .trackback_name { font-weight: bold; } /*TB記事の概要*/ .trackback_body {} /*TBブログ情報*/ .trackback_state { margin-bottom: 5px; } /*=====両サイドの詳細=====*/ /*---各メニューの枠---*/ .menu_area { margin: 0 0 15px; padding: 10px; border: 1px solid #9798ca; } /*---各メニューの内容---*/ .menu_contents { padding: 0; } /*---各メニュー内のリスト---*/ ul li { margin-left: 0; } /*検索(中央に配置)*/ #site_search { text-align: center; } #site_search table { margin: 0 auto; } /*QRコード*/ #mobile { text-align: center; } /*アマゾン*/ .amazon { font-size: smaller; text-align: center; } .amazon_text { margin: 5px 0; text-align: left; } /*---JUGEM広告---*/ #jad_area { text-align: center; margin-bottom: 5px; } /*=====ページ送りー=====*/ /*---ページ送り全体---*/ #pager { text-align: center; } /*ページ送りの個々の枠*/ #pager span { margin-left: 3px; padding: 3px; font-weight: bold; border: 1px solid #9798ca; } /*ページ送り ・該当ページ*/ span.current { font-weight: bolder; } /*ページ送り 前のページ*/ span.pager_prev {} /*ページ送り 最初のページ*/ span.pager_first {} /*ページ送り 最後のページ*/ span.pager_last {} /*ページ送り 次のページ*/ span.pager_next {} /*=====TOPへのリンク=====*/ .page_top { margin-top: 10px; padding: 3px; text-align: center; font-weight: bolder; border: 1px solid #9798ca; } /*=====上・下へのリンク(左最下部)▲▼ *HTMLにて▲,▼のテキスト部分を他の文字や画像に差し替えることも出来ます。 *filter:以下は透明度の指定なので不要なら削除可。 *リンク自体不要ならHTML内の<!-- 上・下へのリンク -->〜<!-- /上・下へのリンクここまで/ -->の部分を削除して下さい。 ================================================================================================= */ #up_down { position: fixed; top: 80%; right: 0; /*左側に設置する場合はleft: 0;に変更*/ z-index: 888; width: auto; height: auto; padding: 10px; /*指定しないとIEでは文字が完全に表示されない為*/ font-size: 2em; line-height: 1em; filter: alpha(opacity=50); /* for IE */ -moz-opacity: 0.5; /* for Firefox(old) */ -webkit-opacity: 0.5; /* for Google Chrome */ opacity: 0.5; } /*============================================================= * [7] フォーム =============================================================*/ /*=====共通のフォント=====*/ input[type=text], input[type=password], input[type=file], input#search, textarea, input[type=submit], input[type=reset], input[type=password], input[type=file], .button, select,select option,select optgroup { font-family: "Georgia","メイリオ","Meiryo","Trebuchet MS","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","MS Pゴシック","Osaka‐等幅",sans-serif; font-style: normal; font-size: small; } /*forms---searchだけ[type=text]指定なし*/ /*=====各テキスト入力欄=====*/ input[type=text], input[type=password], input[type=file], input#search { vertical-align: middle; line-height: 1.5em; /*IE変化なし*/ color: #eef; background: transparent; border: 1px solid #336; /*or #23336a*/ } /*=====テキストエリア(コメント入力欄)=====*/ textarea { overflow: auto; color: #eef; background: transparent; border: 1px solid #336; } /*=====テキスト、テキストエリア:フォーカス時(IEはfocus無効)=====*/ input[type=text]:focus, input[type=password]:focus, input[type=file]:focus, input#search:focus, textarea:focus,textarea#description:focus, input[type=text]:hover, input[type=password]:hover, input[type=file]:hover, input#search:hover, textarea:hover, textarea#description:hover { color: #eef; background: #336; } /*-----コメント投稿覧の各テキスト入力欄の幅-----*/ input#name, input#email ,input#url { width: 60%; } /*-----コメント投稿覧のコメント入力欄の幅と高さ-----*/ textarea#description { width: 80%; height: 100px; } /*-----トラックバックURL表示欄の幅と下の余白-----*/ input#tb_url { width: 60%; margin-bottom: 5px; } /*-----検索テキスト入力欄の幅と左の余白-----*/ input#search { width:100px; margin-right: 3px; } /*=====ボタン=====*/ input[type=submit], input[type=reset], input[type=file],.button { overflow: visible; /* for IE */ vertical-align: middle; /*IE変化なし*/ line-height: 1.5em; /*IEこれ以下は文字切れ*/ padding: 0 1px;/*padding指定はIE変化なし*/ color: #336; background: transparent; border: 1px solid #336; } /*=====ボタン:フォーカス時(IEはfocus無効)=====*/ input[type=submit]:focus, input[type=reset]:focus, input[type=file], .button:focus, input[type=submit]:hover, input[type=reset]:hover, input[type=file]:hover, .button:hover { color: #eef; background: #336; } /*-----コメント送信ボタンとッチェックボクス-----*/ input#c_submit, input[type=checkbox], #set_cookie { margin-top: 5px; vertical-align: baseline; } /*=====選択メニュー(予備)=====*/ /*------選択メニューの中-----*/ select,select option,select optgroup { font-size: small; font-style: normal; color: #eef; background: #336; } /*------選択メニューの枠線-----*/ select { border: 1px solid #336; } /*============================================================= * [8] その他 =============================================================*/ /*=====区切り線=====*/ /*IEでは色が反映されないのでvisibility: hidden;にして不可視にしても可*/ hr, .entry hr, .entry_body hr, .jgm_entry_desc_mark hr, .entry_more hr { border: 0; height: 1px; background: #336 !important; } /*=====引用ほか=====*/ blockquote { margin: 1em; padding: 1em; border: 1px dotted #336; } .entry pre, .entry code { font-family: "Courier New",Consolas,Courier,monospace; font-size: medium; background: #9798ca; } .entry code { line-height: 1; vertical-align: baseline; } .entry pre { padding: 1em; overflow: auto; } /*======記事内のリスト======*/ .entry ul, .entry ol { line-height: 1.6em; } .entry ul li { list-style-type: disc; margin-left: 1.5em; /*1emではIEで途切れる*/ } .entry ul ul li { list-style-type: circle; margin-left: 1.5em; } .entry ol li { list-style-type: decimal; margin-left: 1.5em; } .entry ol ol li { list-style-type: decimal-leading-zero; margin-left: 1.5em; } /*=====記事内の画像=====*/ img.pict { border:0; padding: 5px; } /*============================================================= * Fin. =============================================================*/
高品質デザイン選び放題で、あなた好みのブログに。今すぐブログ作成!
今すぐ
無料ブログ
をはじめよう! ≫
ブログ作成
利用規約
|
プライバシーポリシー
|
推奨環境
|
会社概要
|
サイトマップ
Copyright © 2003-2021 株式会社メディアーノ All Rights Reserved.
ページの先頭へ↑