|
2005/12/26 の記事
|
|
bizzare_columnと3color_columnの色カスタマイズ方法
bizzare_columnと3color_columnは同じテンプレートをベースとして
色違いで作られています 他の色を使ったものが欲しい という要望がありましたので 以下に色を変更する方法を記載します 簡単なので自分の好きな色で様々なバリエーションを楽しんで見てくださいv また色の組み合わせを考えるのが大変 という場合は「トリカラーパレット」というツールが大変便利です ダウンロードはこちらから出来ます 変更する箇所は以下のbackground-color:の色指定の部分だけです (赤で表示してあります) 簡単なので色を変えたい場合は一度ぜひチャレンジしてみてください) CSSテキスト部分に以下のような場所がありますので探して変更願います td#left-column1 { background-color: #D24812; padding-left : 5px; padding-right: 2px; } td#left-column2 { background-color: #EAE2B3; padding-left : 20px; } td#left-column3 { /*background-color: #E0E0C2;*/ background-color: #EAE2B3; padding: 20px; } td#left-column1 はCALENDARや、RECENT ENTRIES、COMMENT、TRACKBACKなどが表示されている部分の色を指定します td#left-column2 はtd#left-column1の左側に表示される飾り帯の色を指定します td#left-column3 はコメントやトラックバックの内容を表示した時に現れる部分の色を指定します (/*background-color: #E0E0C2;*/のように/**/で囲まれた部分はコメントアウトされているため ブログの表示を確認した際にはその設定は反映されていません 私のCSSには時々こういったコメントアウトされた部分があるのですが その際にはその部分の表記は無視してくださって結構です) #header { background-color: #A90505; padding: 10px 20px; border-bottom: 1px solid #A90505; } #header はブログのタイトル部分の色を指定するところです div#calendar { margin-top: 2px; background-color: #D24812; } div#calendar のバックグラウンドの色はtd#left-column1の色と一緒にすると違和感なく表示されます .comment-header { /*background-color: #D7CD99;*/ background-color: #E59B1B; padding-left: 2px; padding-right: 2px; } .comment-footer { background-color: #EAE2B3; } .trackback-header { /*background-color: #D7CD99;*/ background-color: #E59B1B; padding-left: 2px; padding-right: 2px; } .trackback-footer{ background-color: #EAE2B3; margin-bottom: 20px; } .comment-header、.comment-footer、.trackback-header、.trackback-footer はtd#left-column3の色と同じにするか .comment-header、.comment-footer だけ少し違う色合いにするなど 自分で好きなようにアレンジしてみて下さい |
|
FF12 ジャッジ3人の情報+1月にさらに情報流出予定!!« | HOME | »FF12 ジャッジ3人の名前が判明!
コメント
コメントの投稿
- アダルトサイト、不審なサイト、およびそれに順ずるようなサイトへのリンクを張ったコメントは内容如何に関わらず即刻削除の対象とします。
トラックバック
- 無関係な記事へのトラックバックは遠慮願います。また、キーワードが同じでも記事内容に関連がない場合もご遠慮ください。
http://ff12expo.blog6.fc2.com/tb.php/1062-3c58f42d










