忍者ブログ

CusblO

忍者ブログテンプレートカスタマイズ ブログテンプレートCSS/HTMLカスタマイズ覚書 忍者用ブログテンプレート作成中

HOME[PR]カラムとサイドバーとプラグイン2カラムを3カラムに変更 CSS

[PR]

09/22(Fri)  YESR2017

×

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

2カラムを3カラムに変更 CSS

03/10(Wed)  YESR2010

中央寄せタイプ
全体ブロックを中央寄せにしてサイドにプラグインを増設するタイプ

IDは忍者ブログ用
他社ブログを変更の場合はIdを書き換える

 
HTML
<body>
<div id="MainBlock">
<div id="WraperBlock">
<div id="PluginBlockLeft">
左側に表示するプラグインカテゴリー 
</div><!--//PluginBlockLeftの閉じタグ//-->
<div id="EntryBlock">
記事部分を表示
</div><!--//EntryBlockの閉じタグ//-->
</div><!--//WraperBlockの閉じタグ//-->
<div id="PluginBlockRight">
右側に表示するプラグインカテゴリー 
</div><!--//PluginBlockRightの閉じタグ//-->
</div><!--//MainBlockの閉じタグ//-->
</body>


 /*全体*/
body {
text-align:center; /*ブログ本体をセンタリング*/
}
/*ブログが表示される部分*/
div#MainBlock {
margin:0px auto;/*ブログ全体をセンタリング*/
width:740px;
text-align:left;
}
/*左側のプラグイン+記事表示部分*/
div#WrapperBlock {
width:540px;
float:left;
}
/*記事表示部分*/
div#EntryBlock {
width:340px;
float:right;
}
/*左側のプラグイン*/
div#PluginBlockLeft {
width:190px;
float:left;
}
/*右側のプラグイン*/
div#PluginBlockRight {
width:190px;
float:right;
}
/*フッターブロック*/
div#FooterBlock {
clear:both;/*回り込みを全て解除*/
}

拍手

PR

この記事にコメントする

お名前
タイトル
文字色
メールアドレス
URL
コメント
パスワード   Vodafone絵文字 i-mode絵文字 Ezweb絵文字
 管理人だけに表示

この記事へのトラックバック

この記事にトラックバックする:

プロフィール カスタマイズ« HOME »幅サイズ 縦・横・行間

最新コメント
[04/23 管理人]

最新トラックバック
(03/10)

Yurapisは、Twitterとmyspace同期中

ブログ:
ネーム:
かすぽ
趣味:
美しい・綺麗なものの鑑賞
自己紹介:
CusBloスタート:2010.03.07
3月16日1作目完成とどうじに愛猫天使記念日

最近自分が引っ込み思案と知った。
フリーかつ手動作成まっしぐら中

素材配布サイト様へ:リンク漏れが有る場合以下の専用ページにコメントください



Copyright (C) CusblO
TEMPLATE by CusBlo
     忍者ブログ [PR]
 | 管理 | 新記事