--
--
--

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
2008
02
10

「colorfree」の色変更例

 共有テンプレート「colorfree」は、メニュータイトル背景画像、記事タイトル上ラインを透過png(正式にはアルファチャンネルpng)にしてあります。
 スタイルシートをエディター(「メモ帳」など)にコピー&ペーストし、色コードをお好みの色コードに置換してください。(「メモ帳」の場合は、置換:Ctrl+H)
 カレンダーの当日背景色指定のみ、HTML中にあります。
#222=文字色
#444=タイトル色
#969=リンク色
#c9c=枠線色
#ede=背景色

#000=文字色
#000=タイトル色
555=リンク色
#c00=枠線色
#555=背景色
var bgcol='#ccc';
/* 「当日」の背景色 */

#222=文字色
#444=タイトル色
#F06=リンク色
#0f7=枠線色
#fde=背景色
var bgcol='#0f7';
/* 「当日」の背景色 */

#222=文字色
#FEA219=タイトル色
#818113=リンク色
#B02319=枠線色
#FBFAA7=背景色
var bgcol='#FF5734';
/* 「当日」の背景色 */

一番右のカラーコーディネートは、COLOURlovers「パレット:Jamba!」(by vialed)をお借りしています。(COLOURloversを最初に知ったのはGIGAZINEさんの記事がきっかけでした……1年も前なのか(ーωー;)
スポンサーサイト
Comment
 


管理者にだけ表示を許可する

[73]

一つ教えていただきたいのですが、「リンク(公式)」「Tree-Recent」の後ろにある背景画像の色は変えられますか?
透過pngなっている、と書いてあるんですけど、画像を作らずに(文字を書き換えるだけで)変更する事ができるんでしょうか?

[74] horo1161さん、いらっしゃいませ。

テンプレートのスタイルシートのなかで、
「.menutitle」
を検索(ctrl+f)してください。

.menutitle {
(中略)
background-color:#ede;e-7
(中略)
}
上記部分の色コードを変更すると、「メニューのタイトル」に(全部)反映されます。

それとも、全部個別に違う色にかえる意味でしょうか?だとすると、もうちょっと面倒です。

[75]

できました!!
ありがとうございます。
こんな感じにしたかったんです。

テンプレート、使わせていただきます。
ありがとうございました。

[76] horo1161さん

どんどんお好きな色に塗り替えてしまってくださいe-68

[77]

素敵なテンプレートですね
色が綺麗で使わせて頂きたいのですが
文字の大きさを変えても良いでしょうか?
その際、どの部分HTMLを変えたらよいかアドバイス頂けますか?

変えたい場所は、両サイドと記事部分です

[79] 沙耶さんいらっしゃいませ。

いろいろ指定したいのであれば、まずテンプレートスタイルシートのなかから、全体設定のファイルサイズ部分を削除してください。
body {(略)
font-size : x-small !important; /* 古いIEの文字サイズ */
voice-family : ""}""; /* おまじない */
voice-family : inherit; /* おまじない */
font-size : small !important; /* CSSを正しく解釈出来るブラウザ用の文字サイズ */
}

●中央カラム関係
/* 記事のタイトル部分 */
.entry-header {(略)
font-size :x-small ; /* 古いIEの文字サイズ ★ここを訂正*/
border-bottom : 0px solid #c9c;
voice-family : ""}""; /* おまじない */
voice-family : inherit; /* おまじない */
font-size : small; /* CSSを正しく解釈出来るブラウザ用の文字サイズ ★ここを訂正*/
color:#444;
}

html>body div.c h2 {
font-size : small; /* Opera用の文字サイズ ★ここを訂正*/
}

/* 記事本体部分 */
div.entry-body {(ここに文字サイズ追加)
}

/* メニュータイトル部分
------------------------------------------------------------ */
.menutitle {(略)
font-size : x-small; /* 古いIEの文字サイズ★ここを訂正 */
voice-family : ""}""; /* おまじない */
voice-family : inherit; /* おまじない */
font-size : small; /* CSSを正しく解釈出来るブラウザ用の文字サイズ★ここを訂正 */
}

両脇部分は、
div#secondary-column {(★ここに文字サイズ追加)
}

div#extra-column {(★ここに文字サイズ追加)
}
/* メニュータイトル部分
------------------------------------------------------------ */
.menutitle {(略)
font-size : x-small; /* 古いIEの文字サイズ ★ここを訂正*/
voice-family : ""}""; /* おまじない */
voice-family : inherit; /* おまじない */
font-size : small; /* CSSを正しく解釈出来るブラウザ用の文字サイズ ★ここを訂正*/
}

けっこう修正箇所多いですね。

[80]

早々と、お返事感激です
ご丁寧に書き込んで下さって嬉しいです
今から出掛けるのですが、帰ってから
さっそく、頑張ってやらせていただきます
本当にありがとうございました

[316] カテゴリーのツリー化で・・・

またまたお世話になります。
カテゴリーをツリー化したら見出し部分の文字色が薄くなったのですが文字色を合わせるにはどうすれば良いのでしょうか。よろしくお願いします。

[318] るなのんさん

あ、すみません、そこ自分でも薄すぎたと思っているところなんです。
下記の2箇所を直してください。
ただ、リンクの前の丸マークの色も連動して変わってしまいます。
div#secondary-column li {
color:[色コード];
}
div#extra-column li {
color:[色コード];
}

[319] ありがとうございます

色コード#222にしたんですが字が黒くなってしまします。
コード違いますか?

[320] るなのんさん

下記のカラーコードのツールが使いやすいです。
http://hp.vector.co.jp/authors/VA022006/cp/ks_cp/index.html
HEXの欄に、「#222」をいれて確認してください。
黒ではありませんが、かなり濃いグレイです。

colorfreeで使用している色のコードについては、このコメントを入れている記事のなかにピックアップしてあります。

[321]

ありがとうございました!
#969にしました。

[322] るなのんさん

その色でよかったのですね、気にいっていただけてよかったです。

[339] すみません、また・・・

いつもありがとうございます。
カテゴリーのツリー化なんですが以前のものから違うものへ(やりかたがいろいろあるみたいで)変更したらまた見出し部分の文字色が黒くなってしまいました。以前変更した部分と違うところを変えないといけないんでしょうか・・・。よろしくお願いします。
あと、見出しの前にあった●もなくなってしまいました。

[341] るなのんさん、ブログを見せていただいたのですが

写真類の肖像権/著作権は……大丈夫なんでしょうか?
個人的に、著作権法上問題のあるブログのサポートはしないことにしているのですが……。

Trackback
Trackback URL

«  | HOME |  »

Manannan Mac Lir

共有テンプレート


Tree-Recent


Tree-Comment


Tree-TB


カテゴリ


Tree-Arcive


CalendArchive


ブログ管理メニュー(新)


タグリスト(旧


ユーザータグ


テンプレート構造解析


フォーラムリンク


最新コメント


リンク


バナー貼


カテゴリ


画像一覧(月別)


ブログ内検索


プロフィール


Tree-LINK


RSSフィード


上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。