*ADMIN*

Customize in Ninja Blog

NINJAブログを使いこなそうと始めたブログ。

≪ 2024.11│ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 ≫

2024-11-22(Fri)

[PR]

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

author:あるふぁ [06:30:57]│ Comment(-) │ Trackback(-) │〆

│▲

2006-04-08(Sat)

３カラムの骨組み

左右メニューブロックの作り方で多少説明したのですが、分かりづらいので骨組みだけを作ってみました。
忍者の新規テンプレート作成から３カラムにしたものです。
忍者ブログのテンプレート編集機能は全て使えます。
３カラムを作りたい。でもどーしても分からないという場合にのみお使いください。

最終的イメージは前と同じ↓のような感じになってます。

左右メニューブロックの作り方でいうと②の方法を取ります。
（ただし前の記事とはID指定を変えました）

このテンプレートのデータ
・左右メニューの幅：190px
・記事部分の幅：340px
・プラグインカテゴリー１・２が左(若しくは真ん中)の列に表示
・プラグインカテゴリー３・４・５が一番右の列に表示
・4/26追加⇒全体センタリング

＊注
　これを使って共有化するのはとめませんが、推奨はしません。
　自分で３カラムぐらいは組めるようになってから共有化は考えましょう。
　えらそうなことを言って申し訳ないとは思いますが、最低限これぐらいはできないと公開しても自分が困るだけかと思います。

▼HTMLのソース

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="ja">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta http-equiv="Content-Style-Type" content="text/css">
	<meta http-equiv="Content-Script-Type" content="text/javascript" >
	<meta name="keywords" content="<!--$g_keyword1--> <!--$g_keyword2--> <!--$g_keyword3-->" >
	<meta name="description" content="<!--$g_explanation-->">
	<link rel="stylesheet" href="http://<!--$g_user_id-->/css/" type="text/css">
	<link rel="alternate" type="application/rss+xml" title="RSS" href="http://<!--$g_user_id-->/RSS/">
	<link rel="alternate" type="application/atom+xml" title="ATOM" href="http://<!--$g_user_id-->/ATOM/">
	<title><!--$g_title--> <!--$g_page_title--></title>
</head>
<body>
	<div id="mainBlock">
		<!--if_not_edit-->
<div id="WrapperBlock">
		<div id="TopBlock">
			<div id="TopTitle">
				<a href="<!--$g_url-->"><!--$g_title--></a>
			</div>
			<div id="TopExplanation">
				<!--$g_explanation-->
			</div>
		</div>

		<div class="PluginBlock">
			<!--plugin1-->
			<div class="PluginInnerBlock">
				<div class="PluginTitle <!--$plugin_title_align-->">
					<!--$plugin_title-->
				</div>
				<div class="PluginExplanation <!--$plugin_explanation_align-->">
					<!--$plugin_header_explanation-->
				</div>
				<div class="PluginContents <!--$plugin_contents_align-->">
				<!--$plugin_data-->
				</div>
				<div class="PluginExplanation <!--$plugin_explanation_align-->">
					<!--$plugin_footer_explanation-->
				</div>
			</div>
			<!--/plugin1-->

			<!--plugin2-->
			<div class="PluginInnerBlock">
				<div class="PluginTitle <!--$plugin_title_align-->">
					<!--$plugin_title-->
				</div>
				<div class="PluginExplanation <!--$plugin_explanation_align-->">
					<!--$plugin_header_explanation-->
				</div>
				<div class="PluginContents <!--$plugin_contents_align-->">
				<!--$plugin_data-->
				</div>
				<div class="PluginExplanation <!--$plugin_explanation_align-->">
					<!--$plugin_footer_explanation-->
				</div>
			</div>
			<!--/plugin2-->

		</div>


		<div id="EntryBlock">
			<div class="PageLinkBlock">
				<!--pagelink_10-->
					[<!--$pagelink_10_link-->] 
				<!--/pagelink_10-->
			</div>
			<!--entry-->
			<div class="EntryInnerBlock">
				<div class="EntryTitle">
					<a href="<!--$entry_link-->"><!--$entry_title--></a>
				</div>
				<div class="EntryTextBox">
					<div class="EntryText">
						<!--$entry_text-->
					</div>
					<!--if_entry-->
					<!--if_ps_text-->
					<br>
					<div class="EntryText">
						<!--$entry_ps_text-->
					</div>
					<!--/if_ps_text-->
					<!--/if_entry-->

					<!--if_not_entry-->
					<!--if_ps_text-->
					<div class="EntryPsText">
						<a href="<!--$entry_link-->">[<!--$entry_ps_title-->]</a>
					</div>
					<!--/if_ps_text-->
					<!--/if_not_entry-->
				</div>
				<div class="EntryFooter">
					<span class="EntryUserName"></span>
					<span class="EntryWriteDate">
						<a href="/Date/<!--$entry_year--><!--$entry_mon--><!--$entry_day-->/"><!--$entry_year-->/<!--$entry_mon-->/<!--$entry_day--> (<!--$entry_wday-->)</a>
					</span>
					<span class="EntryCategory">
						<a href="<!--$entry_category_link-->"><!--$entry_category--></a>
					</span>
					<!--if_tb_receipt-->
					<span class="EntryTrackback">
							<a href="<!--$entry_link-->#trackback">Trackback(<!--$entry_trackback_num-->)</a>
					</span>
					<!--/if_tb_receipt-->

					<!--if_cm_receipt-->
					<span class="EntryComment">
						<a href="<!--$entry_link-->#comment">Comment(<!--$entry_comment_num-->)</a>
					</span>
					<!--/if_cm_receipt-->
				</div>
			</div>
			<!--/entry-->

			<!--if_entry-->
			<!--if_cm_receipt-->
			<div class="CommentBlock">
				<div class="CommentTitle">この記事にコメントする</div>

				<div class="CommentFormBlock">
					<form action="<!--$comment_form_link-->" method="POST">
					<a name="comment"></a>
					<table id="CommentFormTable" cellpadding="0" cellspacing="0">
						<tr>
							<td class="CommentFormTh">お名前</td>
							<td class="CommentFormTd"><input class="CommentForms" type="text" name="name" value="<!--$g_cookie_name-->"></td>
						</tr>
						<tr>
							<td class="CommentFormTh">タイトル</td>
							<td class="CommentFormTd"><input class="CommentForms" type="text" name="title" value=""></td>
						</tr>
						<tr>
							<td class="CommentFormTh">文字色</td>
							<td class="CommentFormTd">
								<select id="color" name="color">
									<option value="Black" style="color:Black">Black
									<option value="LimeGreen" style="color:LimeGreen">LimeGreen
									<option value="SeaGreen" style="color:SeaGreen">SeaGreen
									<option value="Teal" style="color:Teal">Teal
									<option value="FireBrick" style="color:FireBrick">FireBrick
									<option value="Tomato" style="color:Tomato">Tomato
									<option value="IndianRed" style="color:IndianRed">IndianRed
									<option value="BurlyWood" style="color:BurlyWood">BurlyWood
									<option value="SlateGray" style="color:SlateGray">SlateGray
									<option value="DarkSlateBlue" style="color:DarkSlateBlue">DarkSlateBlue
									<option value="LightPink" style="color:LightPink">LightPink
									<option value="DeepPink" style="color:DeepPink">DeepPink
									<option value="DarkOrange" style="color:DarkOrange">DarkOrange
									<option value="Gold" style="color:Gold">Gold
									<option value="DimGray" style="color:DimGray">DimGray
									<option value="Silver" style="color:Silver">Silver
								</select>
							</td>
						</tr>
						<tr>
							<td class="CommentFormTh">メールアドレス</td>
							<td class="CommentFormTd"><input class="CommentForms" type="text" name="mail" value="<!--$g_cookie_mail-->"></td>
						</tr>
						<tr>
							<td class="CommentFormTh">URL</td>
							<td class="CommentFormTd"><input class="CommentForms" type="text" name="url" value="<!--$g_cookie_url-->"></td>
						</tr>
						<tr>
							<td class="CommentFormTh">コメント</td>
							<td class="CommentFormTd"><textarea class="CommentForms" name="comment" cols="40" rows="4"></textarea></td>
						</tr>
						<tr>
							<td class="CommentFormTh">パスワード</td>
							<td class="CommentFormTd"><input class="CommentForms" type="password" name="pass"></td>
						</tr>
						<tr>
							<td colspan="2" class="CommentFormSubmit">
								<input type="submit" value="送信">
							</td>
						</tr>
					</table>
					</form>
				</div>

				<!--comment-->
				<div class="CommentTextBox">
					<a name="comment<!--$comment_no-->"></a>
					<div class="CommentTitle">
						<!--$comment_title-->
					</div>
					<div class="CommentText">
						<!--$comment_text-->
					</div>
					<div class="CommentFooter">
						<span class="CommentUserName"><!--$comment_mail_link--></span>
						<span class="CommentURL"><!--$comment_homepage_link--></span>
						<span class="CommentWriteDate"><!--$comment_year-->/<!--$comment_mon-->/<!--$comment_day-->(<!--$comment_wday-->)<!--$comment_hour-->:<!--$comment_min-->:<!--$comment_sec--></span>
						<span class="CommentEdit">
							<a href="<!--$comment_edit_link-->">編集</a>
						</span>
					</div>
				</div>
				<!--if_comment_res-->
				<div class="CommentResBlock">
					<div class="CommentResBox">
						<div class="CommentResTitle"><!--$comment_res_title--></div>
						<div class="CommentResText"><!--$comment_res_text--></div>
						<div class="CommentResFooter">
							【<!--$comment_res_year-->/<!--$comment_res_mon-->/<!--$comment_res_day--> <!--$comment_res_hour-->:<!--$comment_res_min-->】
						</div>
					</div>
				</div>
				<!--/if_comment_res-->
				<!--/comment-->
			</div>
			<!--/if_cm_receipt-->

			<!--if_tb_receipt-->
			<div class="TrackbackBlock">
				<div class="TrackbackTitle">この記事へのトラックバック</div>
				<div class="TrackbackURLTitle">
					<a name="trackback"></a>
					この記事にトラックバックする：<input id="TrackbackURL" type="text" name="tbURL" value="<!--$g_trackback_url-->" onclick="this.select(0,this.value.length)">
				</div>
				<!--trackback-->
				<div class="TrackbackTextBox">
					<a name="trackback<!--$trackback_no-->"></a>
					<div class="TrackbackTitle">
						<!--$trackback_title-->
					</div>
					<div class="TrackbackText">
						<!--$trackback_excerpt-->
					</div>
					<div class="TrackbackFooter">
						<span class="TrackbackURL"><!--$trackback_homepage_link--></span>
						<span class="TrackbackWriteDate"><!--$trackback_year-->/<!--$trackback_mon-->/<!--$trackback_day-->(<!--$trackback_wday-->)<!--$trackback_hour-->:<!--$trackback_min-->:<!--$trackback_sec--></span>
					</div>
				</div>
				<!--/trackback-->
			</div>
			<!--/if_tb_receipt-->
			<!--/if_entry-->

			<div class="PageLinkBlock">
				<!--if_prev_page-->
					<<
					<a href="<!--$pagelink_prev_link-->"><!--$pagelink_prev_title--></a>
				<!--/if_prev_page-->
				<!--if_not_page--><a href="<!--$g_url-->">HOME</a><!--/if_not_page-->
				<!--if_next_page-->
				<a href="<!--$pagelink_next_link-->"><!--$pagelink_next_title--></a>
				>>
				<!--/if_next_page-->
			</div>
		</div>
</div>
<div id="RightPluginBlock">
			<!--plugin3-->
			<div class="PluginInnerBlock">
				<div class="PluginTitle <!--$plugin_title_align-->">
					<!--$plugin_title-->
				</div>
				<div class="PluginExplanation <!--$plugin_explanation_align-->">
					<!--$plugin_header_explanation-->
				</div>
				<div class="PluginContents <!--$plugin_contents_align-->">
				<!--$plugin_data-->
				</div>
				<div class="PluginExplanation <!--$plugin_explanation_align-->">
					<!--$plugin_footer_explanation-->
				</div>
			</div>
			<!--/plugin3-->

			<!--plugin4-->
			<div class="PluginInnerBlock">
				<div class="PluginTitle <!--$plugin_title_align-->">
					<!--$plugin_title-->
				</div>
				<div class="PluginExplanation <!--$plugin_explanation_align-->">
					<!--$plugin_header_explanation-->
				</div>
				<div class="PluginContents <!--$plugin_contents_align-->">
				<!--$plugin_data-->
				</div>
				<div class="PluginExplanation <!--$plugin_explanation_align-->">
					<!--$plugin_footer_explanation-->
				</div>
			</div>
			<!--/plugin4-->

			<!--plugin5-->
			<div class="PluginInnerBlock">
				<div class="PluginTitle <!--$plugin_title_align-->">
					<!--$plugin_title-->
				</div>
				<div class="PluginExplanation <!--$plugin_explanation_align-->">
					<!--$plugin_header_explanation-->
				</div>
				<div class="PluginContents <!--$plugin_contents_align-->">
				<!--$plugin_data-->
				</div>
				<div class="PluginExplanation <!--$plugin_explanation_align-->">
					<!--$plugin_footer_explanation-->
				</div>
			</div>
			<!--/plugin5-->
</div>

		<!--/if_not_edit-->

		<!--if_edit-->
			<div class="CommentBlock">
				<div class="CommentTitle">コメントを編集する</div>

				<div class="CommentFormBlock">
					<form action="<!--$edit_form_link-->" method="POST">
					<div class="CommentFormBlock">
						<table id="CommentFormTable" cellpadding="0" cellspacing="0">
							<tr>
								<td class="CommentFormTh">お名前</td>
								<td class="CommentFormTd"><input class="CommentForms" type="text" name="name" value="<!--$edit_name-->"></td>
							</tr>
							<tr>
								<td class="CommentFormTh">タイトル</td>
								<td class="CommentFormTd"><input class="CommentForms" type="text" name="title" value="<!--$edit_title-->"></td>
							</tr>
							<tr>
								<td class="CommentFormTh">文字色</td>
								<td class="CommentFormTd">
									<select id="color" name="color">
										<option value="Black" style="color:Black">Black
										<option value="LimeGreen" style="color:LimeGreen">LimeGreen
										<option value="SeaGreen" style="color:SeaGreen">SeaGreen
										<option value="Teal" style="color:Teal">Teal
										<option value="FireBrick" style="color:FireBrick">FireBrick
										<option value="Tomato" style="color:Tomato">Tomato
										<option value="IndianRed" style="color:IndianRed">IndianRed
										<option value="BurlyWood" style="color:BurlyWood">BurlyWood
										<option value="SlateGray" style="color:SlateGray">SlateGray
										<option value="DarkSlateBlue" style="color:DarkSlateBlue">DarkSlateBlue
										<option value="LightPink" style="color:LightPink">LightPink
										<option value="DeepPink" style="color:DeepPink">DeepPink
										<option value="DarkOrange" style="color:DarkOrange">DarkOrange
										<option value="Gold" style="color:Gold">Gold
										<option value="DimGray" style="color:DimGray">DimGray
										<option value="Silver" style="color:Silver">Silver
									</select>
								</td>
							</tr>
							<tr>
								<td class="CommentFormTh">メールアドレス</td>
								<td class="CommentFormTd"><input class="CommentForms" type="text" name="mail" value="<!--$edit_mail-->"></td>
							</tr>
							<tr>
								<td class="CommentFormTh">URL</td>
								<td class="CommentFormTd"><input class="CommentForms" type="text" name="url" value="<!--$edit_url-->"></td>
							</tr>
							<tr>
								<td class="CommentFormTh">コメント</td>
								<td class="CommentFormTd"><textarea class="CommentForms" name="comment" cols="40" rows="4"><!--$edit_text--></textarea></td>
							</tr>
							<tr>
								<td class="CommentFormTh">パスワード</td>
								<td class="CommentFormTd"><input class="CommentForms" type="password" name="pass"></td>
							</tr>
							<tr>
								<td colspan="2" class="CommentFormSubmit">
									<input type="submit" value="送信">
								</td>
							</tr>
						</table>
					</div>
					</form>
				</div>
			</div>
		<!--/if_edit-->
		<div id="FooterBlock">
		<!--CM1--> <!--CM2-->
		</div>
	</div>
</body>
</html>

▼スタイルシートのソース

/**************************************************************************************
全ブロックの共通設定
**************************************************************************************/
/*BODY全体に関する設定*/
body {
text-align:center;
}
/*<td>の全ての設定*/
td {
text-align:center;
}
/*table全ての設定*/
table{
border-collapse: collapse;
}
/*通常のリンクの設定*/
a:link {
}
/*過去に見たことがあるページのリンクの設定*/
a:visited{
}
/*カーソルが合っている状態のリンクの設定*/
a:hover {
}
/*アクティブ状態のリンクの設定*/
a:active {
}
/*全体の設定*/
#mainBlock {
width:770px;
text-align: center;
margin:0px auto;
}
/*テキスト左寄せ*/
.left {
text-align:left;
}
/*テキスト中央寄せ*/
.center {
text-align:center;
}
/*テキスト右寄せ*/
.right {
text-align:right;
}
/**************************************************************************************
トップブロック用デザイン
**************************************************************************************/
/*一番上のブロック（タイトルが書かれる場所）の設定*/
#TopBlock {
width:770px;
height: 200px;
text-align: left;
}
/*ページタイトル文字部分の設定*/
#TopTitle {
padding: 10px 0px 0px 20px;
}
/*ページタイトルの下に来るブログの説明文書*/
#TopExplanation {
padding: 10px 0px 0px 20px;
}

/**************************************************************************************
フッターブロック用デザイン
**************************************************************************************/
/*一番下のブロック（著作権表示が書かれる場所）の設定*/
#FooterBlock {
clear:both;
height: 200px;
text-align: center;
}

/**************************************************************************************
  プラグインブロック用デザイン
**************************************************************************************/
/*プラグイン表示箇所全体の設定（プラグイン１・２)*/
.PluginBlock {
width: 190px;
text-align: left;
float: left;
overflow:hidden;/*はみ出した要素を隠す*/
}
/*プラグイン表示箇所の背景や余白設定*/
.PluginInnerBlock {
padding:10px;
}
/*プラグインのタイトル（名称）部分の設定*/
.PluginTitle {
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
}
/*プラグインの説明部分の設定*/
.PluginExplanation {
padding: 10px;
}
/*プラグインが表示される場所の設定*/
.pluginContents {
padding: 10px;
}
/*一番右側に表示される部分（プラグイン３・４・５)*/
#RightPluginBlock {
width:190px;/*右メニューの表示幅*/
float:right;/*このブロックを右に寄せる*/
overflow:hidden;/*はみ出した要素を隠す*/ 
}
/**************************************************************************************
  記事ブロック用デザイン
**************************************************************************************/
/*記事繰り返し処理全ての部分の設定*/
#EntryBlock {
width: 340px;
float: left;
text-align: left;
overflow:hidden;
}
/*記事表示部分の背景や余白等の設定*/
.EntryInnerBlock {
padding: 10px;
text-align: left;
}
/*各記事タイトル部分の設定*/
.EntryTitle {
text-align: left;
}
/*各記事やコメント、トラックバックなどの総合のブロック部分*/
.EntryTextBox {
margin: 5px 0px;
}
/*記事本文が記載される部分*/
.EntryText {
padding: 10px;
}
/*追記文書が記載される部分*/
.EntryPsText {
padding: 20px;
text-align: right;
}
/*記事へのリンク（コメントやトラックバック等）の背景*/
.EntryFooter {
text-align:right;
padding:5px;
}
/*記事の投稿者名が記載されている部分*/
.EntryUserName {
}
/*記事を投稿した日が記載されている部分*/
.EntryWriteDate {
margin-left: 5px;
}
/*記事のカテゴリ名が記載されている部分*/
.EntryCategory {
margin-left: 5px;
}
/*記事へのコメントリンクが記載されている部分*/
.EntryComment {
margin-left: 5px;
}
/*記事へのトラックバックリンクが記載されている部分*/
.EntryTrackback {
margin-left: 5px;
}
/*次の記事やHOMEへのリンクが表示される背景部分*/
.PageLinkBlock{
text-align:center;
padding:10px;
}
/**************************************************************************************
  各コメント表示部分の設定
**************************************************************************************/
/*コメント全体の設定*/
.CommentBlock{
padding:10px;
}
/*この記事にコメントする　と書かれてる部分の設定*/
.CommentMenuTitle{
text-align: left;
}
/*コメントのタイトル、コメント、コメント情報の全ての背景部分*/
.CommentTextBox{
margin: 5px 0px;
}
/*コメントのタイトル部分*/
.CommentTitle{
text-align: left;
}
/*コメント部分*/
.CommentText{
padding: 10px;
}
/*投稿者や投稿時間などが表示されている部分*/
.CommentFooter{
text-align:right;
padding:5px;
}
/*投稿者名の部分*/
.CommentUserName{
margin-left: 5px;
}
/*投稿者のホームページへのリンク部分*/
.CommentURL{
margin-left: 5px;
}
/*投稿された時間が記載されている部分*/
.CommentWriteDate{
margin-left: 5px;
}
/*コメント編集へのリンク部分*/
.CommentEdit{
margin-left: 5px;
}
/*コメントを投稿するフォーム全体の設定*/
.CommentFormBlock{
margin-bottom:20px;
}
/*コメントフォーム用テーブル*/
.CommentFormTable{
}
/*コメントフォームTHタグ設定*/
.CommentFormTh{
padding-top:5px;
text-align:right;
}
/*コメントフォームTDタグ設定*/
.CommentFormTd{
padding-top:5px;
text-align:left;
}
/*コメントフォーム送信ボタンのTDタグ設定*/
.CommentFormSubmit{
text-align:left;
}
/*inputタグやtextareaの設定*/
.CommentForms{
}
/**************************************************************************************
  トラックバック表示部分の設定
**************************************************************************************/
/*トラックバック全体の設定*/
.TrackbackBlock{
padding:10px;
}
/*トラックバックメニューのタイトル部分*/
.TrackbackMenuTitle{
text-align: left;
}
/*トラックバックのタイトル、記事、リンク部分の総合設定*/
.TrackbackTextBox{
margin: 5px 0px;
}
/*トラックバックタイトルの部分*/
.TrackbackTitle{
text-align: left;
}
/*トラックバックの記事部分*/
.TrackbackText{
padding: 10px;
line-height:140%;
}
/*投稿されたブログ名やリンクなどを表示する部分の設定*/
.TrackbackFooter{
text-align:right;
padding:5px;
}
/*トラックバック元のブログ名部分*/
.TrackbackUserName{
margin-left: 5px;
}
/*トラックバック元へのリンク部分*/
.TrackbackFromURL{
margin-left: 5px;
}
/*トラックバックされた日付部分*/
.TrackbackWriteDate{
margin-left: 5px;
}
/*この記事のトラックバック　と書かれた部分の設定*/
.TrackbackURLTitle{
text-align: left;
font-size: 12px;
}
/*トラックバックする為のURLが記載されているフォーム部分の設定*/
.TrackbackURL{
}
/**************************************************************************************
  各プラグイン共通項目用設定
**************************************************************************************/
/*各プラグイン処理内の基本デザイン*/
.plugin_data {
text-align:left;
padding:5px;
}
/*各プラグイン処理内基本デザインの下に記載する日付など*/
.plugin_data_date {
text-align:right;
}
/**************************************************************************************
  カレンダープラグイン用デザイン
**************************************************************************************/
/*カレンダー日付移動用テーブル（前月、次月へのリンクなど）*/
.CalendarMoveTable {
padding:3px;
width:80%;
}
/*カレンダー日付移動用テーブル、<tr>タグ部分のデザイン*/
.CalendarMoveTr {
}
/*カレンダー日付移動用テーブル内、左側td部分のデザイン*/
.CalendarPrevTd {
}
/*カレンダー日付移動用テーブル内、中央td部分のデザイン*/
.CalendarNowTd {
}
/*カレンダー日付移動用テーブル内、右側td部分のデザイン*/
.CalendarNextTd {
}
/*カレンダー表示用テーブル*/
.CalendarTable {
width:80%;
padding:3px;
}
/*-------------------------------------------------------
  カレンダーテーブル -> 曜日表示部分デザイン
-------------------------------------------------------*/
/*曜日表示部分（<tr>タグ部分）のデザイン*/
.CalendarWdayTr {
}
/*曜日表示部分、日曜日の<th>タグ部分デザイン*/
.CalendarWdaySun {
}
/*曜日表示部分、平日の<th>タグ部分デザイン*/
.CalendarWday {
}
/*曜日表示部分、土曜日の<th>タグ部分デザイン*/
.CalendarWdaySat {
}
/*-------------------------------------------------------
  カレンダーテーブル -> 日付表示部分デザイン
-------------------------------------------------------*/
/*日付表示部分（<tr>タグ部分）のデザイン*/
.CalendarTr {
}
/*日付表示部分、日曜日の<td>タグ部分デザイン*/
.CalendarTdSun {
}
/*日付表示部分、土曜日の<td>タグ部分デザイン*/
.CalendarTdSat {
}
/*日付表示部分、平日曜日の<td>タグ部分デザイン*/
.CalendarTd {
}
/*記事が存在する場所の設定*/
.CalendarTdLink {
}

/*-------------------------------------------------------
  コメント -> 管理者返信部分デザイン
-------------------------------------------------------*/
.CommentResBlock {
	padding:10px 30px 10px 50px;
}

.CommentResBox {
	border:solid 1px #995555;
	padding:10px;
}

.CommentResTitle {
	font-size:14px;
	font-weight:700;
}

.CommentResText {
	padding:10px 0px 0px 10px;
}

.CommentResFooter {
	text-align:right;
	margin:15px 0;
	border-top:1px dotted #995555;
}

author:あるふぁ [21:41:47]│ Comment(1) │Trackback() │〆

[カスタマイズ]テンプレート

│▲

1000人越えたｗ← HOME →左右メニューブロックの作り方

＊COMMENT-コメント-

▽ありがとうございました

ようやく３カラム、形にすることができました！！
型崩れ(?)というのは３カラムにしたくらいでは起こりませんよね？
ありがとうございました。

注：このコメントはキャッシュを元にした再現です
本来の投稿日時は｢2006-04-09-Sun 09:30:34｣でした。

posted by 悶左衛門 URL ::2006-05-31-Wed 13:09:37 ::EDIT

△Re:ありがとうございました

>ようやく３カラム、形にすることができました！！
お役に立てたなら、よかったです♪

>型崩れ(?)というのは３カラムにしたくらいでは起こりませんよね？
いえ、ただ３カラムにしただけでも起こる可能性ありなのです。
WinではよくてもMacでは駄目とか。
この記事のは、昔別のブログで使ったときと構造同じなので大丈夫です。
ただ、崩れる原因もいろいろあるので、まぁ地道にそのつど直すしかないですね。

テンプレート作成頑張ってください!!

注：このレスは再現です。元の投稿時間は｢2006-04-09-Sun 14:02｣でした。

あるふぁ│2006-05-31-Wed 13:10

＊COMMENT FORM-コメント投稿-

この記事へのコメント投稿フォームです。

Name：
Title：
Mail：
Url：
Color：	◆ ◆ ◆ ◆ ◆ ◆ ◆ ◆
Decoration：
Message：
Pass：	※編集時に必要です。
Secret：	※チェックすると管理者へのみの表示となります。

＊TRACKBACK-トラックバック-

この記事のURLとトラックバックURLです。
必要に応じてご使用くださいませ。

この記事のURL▼

この記事のトラックバックURL▼

←No.45No.44No.43No.42No.41No.40No.39No.37No.36No.35No.34→

■Category

■Search

■About

●このブログについて
忍者ブログを使いこなそうと始めたカスタマイズサイト。分からないことばかりで四苦八苦しています。変なところあったらぜひ言ってくださいませ(*- -)(*_ _)ペコリ
なお、このブログで実験もしています。常に実験しているので、崩れとかありましたら教えてくださるとうれしいです。⇒BBS

●姉妹サイト・その他
　徒然倶楽部 →こちらは記事の内容を下に移転＆閉鎖しました。
　現在は十六夜's Blogがメインブログになってます。
　Alphaの小部屋･･･BOOKLOGで作った本棚
　Mixi･･･参加中のSNS
　~~十六夜-the sixteeth night-･･･現在作成中のメインHP~~

●リンクについて
このブログはリンクフリーです。こんなブログでよろしければぜひリンクしてやってください♪

●RSS
このブログのRSSはこちら▼
RSS 0.91
RSS 1.0
RSS 2.0

●環境推奨
動作状況：Windows XP SP2
ブラウザ：主にFirefox　他IE、Opera等
解像度：1024*768

●FireFox
私が普段利用しているブラウザ。拡張機能のWeb Developerをいれるとテンプレ作成にとても便利なブラウザになります。自分の使いたい機能をいろいろインストールしてアレンジしてます♪
ダウンロードは▼からどうぞ

●Pingoo!
忍者ブログのPing送信先は10件まで。それでもいろいろなところにPingを送りたいという場合にオススメなPing一括送信サイトです。ここ１件に送るだけでいろいろなところに送ってもらえます♪

●クリックで救える命がある

■Calendar

日	月	火	水	木	金	土
					1	2
3	4	5	6	7	8	9
10	11	12	13	14	15	16
17	18	19	20	21	22	23
24	25	26	27	28	29	30

■CM&TB

●コメント

パンくずナビをつける
Michalexcire⇒(01/18)
パンくずナビをつける
ViktorianitemY⇒(01/17)
コメントや最新記事にNew＆Upマークをつける
kirara⇒(04/06)
しばらく休止いたします。
リゾートバイト⇒(12/04)
独自ドメイン
shige⇒(12/01)

●トラックバック

Scrollbar ONorOFF

■NinjaLink

■Thanks

テンプレートを作成するに当たってよく利用させていただいているサイト様です。

■QRcode

QRコードをクリックするとメールフォームが開きます。
メールフォームでPCから携帯にこのブログのURLを送ることができます

もし、携帯電話で表示されきれない～とご不満の方はこちらのアプリを導入してみることをお勧めします。

無料体験できるのでぜひお試しください♪

■EntryNavigation

最新記事

≪

*45*44*43*42*41*40*39*37*36*35*34*

≫

■Template

○公開したテンプレのプレビュー

詳細	詳細
詳細	詳細	詳細
詳細	詳細	詳細

○公開された携帯用テンプレのプレビュー

詳細

○忍者ブログで共有化中のテンプレ

●Alternation-緑×白-
記事番号で背景色が交互に変わるちょっとおもしろテンプレ。
パンくずナビも付いてます♪

●The Leaf
初の携帯用テンプレート。さわやかな感じに仕上げてみました
絵文字使用。トップページにカテゴリー表示アリ。

●ブルーチャイナ
涼しげなチャイナ風左右メニューテンプレ。
｢China｣の色違いのような感じですが、配置は違いますのでご注意ください。
※このテンプレのピンク版もあります。共有化していないので記事内よりお持ち帰りください。
⇒ピンクチャイナ

●Gray2block
ノート風テンプレ｢Gray｣の２カラム版です。
●China
かわいい系の３カラムテンプレート。イメージはチャイナ風♪
同じ配置の青バージョンも作成しました。こちらは共有化してないので記事内よりお持ち帰りください。
⇒China-BlueVer-

●Gray
灰色のノート風罫線テンプレ。追記開閉式の３カラムです。

●JapnBlue
サッカー日本代表ユニフォームなテンプレ。追記開閉式
※このテンプレには２カラムバージョンもあります。
⇒JapanBlueの２カラム版

●碧-midori-
淡いパステルグリーンのテンプレ。追記開閉式

●蒼
画像使用なしの５ブロックテンプレ。

Scrollbar ONorOFF

○広告

■Recommend

○ルナエンバシージャパン

ストレイシープがなんだかかわいくて好き(^-^*）

■Visiter

blog SEO

[PR] 美容外科 at 名古屋