赤い飯 // img03

赤い飯//テンプレートなどなど。
2008/07/25 (Fri) img03 FC2ブログで写真ブログをはじめてみる。なテンプレを作ってみました。 HTMLとスタイルシートをまるっと以下に変更してください。 HTML <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <head> <meta http-equiv="content-type" content="text/html; charset=euc-jp"> <meta http-equiv="content-style-type" content="text/css"> <meta http-equiv="content-script-type" content="text/javascript"> <link href="<%css_link>" type="text/css" rel="stylesheet"> <link rel="alternate" type="application/rss+xml" title="RSS" href="<%url>?xml"> <title><%blog_name><!--permanent_area--> // <%sub_title><!--/permanent_area--><!--not_permanent_area--> // <%sub_title><!--/not_permanent_area--></title> </head> <body> <div id="container"><!-- container --> <table border="0" width="740" cellpadding="0" cellspacing="1" class="color1"><tr valign="top"><td class="color2"> <div id="primary-column"><!-- primary-column --> <!-- 画像ここから --> <script type="text/javascript"> <!-- function change(url){ if (document.getElementById){ document.getElementById("img").src=url; } } //--> </script> <img src="http://blog-imgs-21.fc2.com/a/k/a/akaimesi/img0301.jpg" width="480" height="360" id="img"> <!-- 画像ここまで --> <!-- ブログタイトル、説明ここから --> <div class="header"> <a href="<%url>"><%blog_name>//<%introduction></a> </div> <!-- ブログタイトル、説明ここまで --> <!-- newここから --> <div class="menu-title">new</div> <!--recent--> <a href="<%recent_link>"><%recent_title><span class="font-s">（<%recent_month>/<%recent_day>）</span></a>// <!--/recent--> <!-- newここまで --> <!-- categoryここから --> <div class="menu-title">category</div> <!--category--> <a href="<%category_link>"><%category_name><span class="font-s">（<%category_count>）</span></a>// <!--/category--> <!-- categoryここまで --> </td><td class="color3"> <div id="secondary-column"><!-- secondary-column --> <!--topentry--> <!-- 記事本文ここから --> <%topentry_body> <!-- 記事本文ここまで --> <!-- 記事日付、タイトルここから --> <div class="entry-title"> 『<%topentry_title>』 <div class="font-s"><%topentry_year>/<%topentry_month>/<%topentry_day> (<%topentry_youbi>)</div> </div> <!-- 記事日付、タイトルここまで --> <!--/topentry--> <!-- 横罫線 --> <hr width="200" size="1" color="#666666"> <!-- /横罫線 --> <!-- ページ移動ここから --> <div class="text-right"><!--prevpage--><a href="<%prevpage_url>"><< back</a> <!--/prevpage--> \| <a href="<%url>">TOP</a> \| <!--nextpage--> <a href="<%nextpage_url>">next >></a><!--/nextpage--></div> <!-- ページ移動ここまで --> <!-- /primary-column --></div> <!-- /secondary-column --></div> </td></tr><tr><td colspan="2"> <div id="footer"><!-- footer --> <!-- フッターここから --> <div class="footer">Copyright © <%blog_name>. all rights reserved.<br><%ad> // <%ad2><br>[ <a href="http://akaimesi.blog32.fc2.com/" target="_blank"><u>design by 赤飯</a></u> ]</div> <!-- フッターここまで --> <!-- /footer --></div> </td></tr></table> <!-- /container --></div> </body> </html> スタイルシート @charset "euc-jp"; /* 全体的な設定 ------------------------------------------------------------ / body { color : #666666; / 文字のいろ / font-size : 12px; / 文字の大きさ / letter-spacing : 1px; / 文字の間隔 / font-family : Verdana,"ＭＳゴシック","Osaka-等幅",monospace; / 文字の種類 / line-height : 1.5; / 行間 / text-align : center;} br {letter-spacing : 0;} a {color : #666666; / リンク文字のいろ /} a:hover {color : #999999;/ リンク文字のいろ（ポイント時） /} div#container { width : 740px; margin-left : auto; margin-right : auto; text-align : left;} / 枠及び背景のいろの設定 ------------------------------------------------------------ / / -------------------- \| \| \| \| \| \| \| \| \| \| \| \| \| \| \| \| (1) \| (2) \| \| \| \| \| \| \| \| \| \| \| \| \| \| \| \| \|------------------\| \| (3) \| -------------------- / body { background-color : #FFFFFF; / 全体の背景のいろ /} .color1 { background-color : #FFCC00; / 枠及び(3)の背景のいろ /} .color2 { background-color : #FFFFFF; / (1)の背景のいろ /} .color3 { background-color : #FFCC00; / (2)の背景のいろ /} / 左カラムの設定 ------------------------------------------------------------ / div#primary-column { width : 480px; margin : 20px;} .header { font-size : 13px; / ブログタイトル、説明の文字の大きさ / text-align : left; margin : 15px 0px;} .header a { color : #666666; / ブログタイトル、説明の文字のいろ / text-decoration : none;} .header a:hover { color : #999999; / ブログタイトル、説明の文字のいろ（ポイント時） / text-decoration : none;} .entry-title { font-size : 12px; / 記事タイトルの文字の大きさ / margin : 5px 0px;} .menu-title { font-size : 10px; / メニュータイトルの文字の大きさ / background : #CCCCCC; / メニュータイトルの背景のいろ / margin : 5px 0px;} .text-right {text-align : right;} .font-s {font-size : 10px} / 右カラムの設定 ------------------------------------------------------------ / div#secondary-column { width : 200px; margin : 20px 9px;} / フッターの設定 ------------------------------------------------------------ / div#footer { color : #666666; / 文字のいろ / font-size : 12px; / 文字の大きさ / letter-spacing : 2px;/ 文字の間隔 / margin : 20px; text-align : right;} div#footer a { color : #666666; / リンク文字のいろ / text-decoration : none;} div#footer a:hover { color : #999999; / リンク文字のいろ（ポイント時） */ text-decoration : none;} あとは横480px縦360pxの画像をアップロードし、記事に <img src="画像ファイルのurl" width="150" height="113" alt="click to full view" onclick="change(this.src)"> と書き込んでいくだけです。表示件数3件だとこんな感じになります。親戚んちのねこです＾＾『』内には記事のタイトルが入ります。テンプレートを作ろう FC2ブログ>>> テンプレ \| trackback(0) \| comment(0) \| <<タルト \| TOP \| 大福あんぱん>> comment name url subject comment 編集key secret 管理人のみ閲覧OK trackback trackback_url http://akaimesi.blog32.fc2.com/tb.php/344-2dcf30a2 \| TOP \|	FC2カウンター付けてみました。カテゴリーご飯 (15) 御八ツ (16) 旅 (20) 買い物 (26) 無料素材 (7) テンプレ (186) テンプレ一覧 (1) テンプレ注意書き (1) Q&A目次 (1) Q&A (14) iroiroGENERATOR (2) プラグイン (2) ミニブログ (1) 最近のエントリーまた行きたいなな金沢21世紀美術館 (08/26) fuwari (08/04) hanabi (08/02) タルト (07/29) img03 (07/25) 最近のコメント赤飯:fuwari (08/19) もったい:fuwari (08/16) 赤飯:hanabi (08/10) ayaka:hanabi (08/07) 赤飯:hanabi (08/06) リンク FC2ブログ御世話になっています。 FC2ミニブログPIYO ぴよっと一言。 FC2プロフプロフ作ってPR。多機能型デザイナーズブログパーツ「FLO:Q」赤い飯＊別館食べる方の赤飯はこちら。 e航空券.com 格安航空券ありがたや。楽天トラベル夏の旅は楽天バスで。簪専門「かんざし屋」すっかり虜。 Amazon.co.jp 満載。楽天市場満載。楽天ブックス 1,500円以上送料無料。楽天カード入会特典2,000ポイント。ブログ内検索最近のトラックバックＬａｂｏＦａｃｔｉｏｎ　別館・雑記倉庫:お世話になったテンプレートへ、 (04/24) ホームベーカリーをあなたに捧げます:ホームベーカリー (03/16) 君は今日からCOOK☆スター！:赤飯－君は今日からCOOK☆スター！ (02/09) SLOW DOWN and...:ちょっと夜更かし (05/13) 赤い飯preview:はじめまして (04/05) 『赤い飯』の右下でゲーム多機能型デザイナーズブログパーツ「FLO:Q」 ↓付けてみました。
Copyright © 赤い飯. all rights reserved. ホームページアフィリエイトレンタルサーバー // FC2ブログアフィリエイト [ design by 赤飯 ]