忍者ブログ

CusblO

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

HOME[PR]カラムとサイドバーとプラグインサイドバープラグインごとを背景画像で綺麗に囲む

[PR]

11/21(Tue)  YESR2017

×

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

サイドバープラグインごとを背景画像で綺麗に囲む

03/14(Sun)  YESR2010

 プラグインヘッダー作成
ラインで区切るのではなく
1つ1つのプラグインを囲んで
飾るための説明

 
タイトル(TOPヘッダーなど) 説明 内容 フッダー の4部構成
背景画像連結はプラグインCSS余白 margin(外)・padding(内)で微調整
 
CSS プラグイン欄に追加
.PluginFooter {
height:24px;/*画像の高さに合わせる*/
background:url(画像URL) no-repeat;
}
 

HTML 各プラグインに追加
<div class="PluginFooter">
          </div>
サンプル<!--plugin数--> 数はプラグインの数字1~5
<!--plugin1-->
        <div class="PluginInnerBlock">
          <div class="PluginTitle <!--$plugin_title_align-->">
            <!--$plugin_title-->
          </div>
          <div class="PluginContentsBox">
            <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>
          <div class="PluginFooter">
          </div>
        </div>
      <!--/plugin数-->
 

拍手

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]
 | 管理 | 新記事