2008年07月08日

カテゴリタイトルのデザイン変更

記事タイトルのデザインに合わせて、カテゴリタイトルのデザインも変更してみました。

元の状態はこんな感じです。
カテゴリタイトルカスタマイズ前

変更後のイメージです。
ここでは、このサンプルイメージに合わせて記述しています。
カテゴリタイトルカスタマイズ後


1.スタイルシートの「#categorytitle」部分を変更します。
#categorytitle{
font-size:16px;
font-weight:bold;
margin-bottom:15px;
border-top:2px solid #FFBE33;
border-bottom:2px solid #FFBE33;
background:#FCECBF;
padding:8px 0 5px 8px;

}

赤字の部分を追加してください。
上の2行がラインを表しています。
「2px」はラインの太さを表しているので好きなように調整してください。
「#FFBE33」はラインの色を表しているので、こちらも好きなように調整してください。

3行目の「background」が背景色を表しています。
「#FCECBF」の部分は好きな色に調整可能です。

4行目の「padding」は文字とラインの余白の調整部分です。
最初の「8px」が上余白、その後順番に、右余白、下余白、左余白のサイズを表しています。
こちらも調整可能です。


2.保存して再構築を行います。

ちなみに、この部分を変更すると、月別アーカイブを表示したときの上部の年月表示にも同じデザインが適応されます。



この記事が参考になった方はランキングの応援お願いします!
人気ブログランキングへ
customize_blog at 12:48コメント(6)トラックバック(0)デザインカスタマイズ  | Edit 

トラックバックURL

コメント一覧

1. Posted by たっけん   2008年07月08日 22:38
はじめまして
たっけんです
ランキングから来ました
いろいろなブロガーさんの情報を向学のために、
見てまわってます。
僕もライブドアブログを使ってますのでとっても参考になります
有益な情報ありがとうございました。
また来ます
応援していきますね♪
2. Posted by さらぽん   2008年07月08日 23:38
おぉ〜、初コメントだ
たっけんさん、ありがとうございます!

いろいろなブログを見て回ってるなんて、たっけんさんは勉強家なんですね。
後でたっけんさんのブログにも遊びに行きますね。

今後ともよろしくお願いします!
3. Posted by たっちゃん   2009年07月03日 07:59
「はじめに」って書いているところがありますよね。これはどうやって作るのでしょうか?
(記事?書き込み?の上、タイトルの下に作る方法) 

ぜひお願いします。
それと気になったのですが、

このブログはリンクフリーです。
以下のテキストエリアの中のHTMLを貼り付けると簡単です♪

うちのPCから見ると、これのサイドバーが「はじめに」 に割り込んでいるのですが、デザイン的にちょっと不自然かなと思いまして、意図してされてるのならいいのですが・・・
よけいなおせっかいですみません。
4. Posted by 不倫   2011年06月27日 15:35
あなたの不倫度をチェックしてみませんか?深層心理が赤裸々に暴かれる!?あなたは果たして純粋に一人だけに愛を捧げることができるのか!
5. Posted by mlb jp   2013年01月18日 10:15
素顔のメートル白い半袖、取り組み繖形の半身裙
6. Posted by 管理人   2015年10月03日 11:24
ブログアンテナ登録のご連絡 お世話になります。貴サイト拝見しまして、同様のテーマを集めたニュースサイトを運営配信しております。非常に良いコンテンツを配信されており勝手ながらアンテナに追加させていただきました。(以下URLのヘッダはスパム対策で外しています)quiccastarter245.kiramori.net/an/anblogmedia/ 相互リンクぜひご検討いただければ幸いです。管理人 

コメントする

名前:
URL:
  情報を記憶: 評価:  顔   星
 
 
 
記事検索
このブログはリンクフリーです。
以下のテキストエリアの中のHTMLを貼り付けると簡単です♪
Archives
Recent Comments
訪問者数
  • 今日:
  • 昨日:
  • 累計:

TagCloud
QRコード
QRコード
  • ライブドアブログ