ウィンドゥは最大表示でお願いいたします。
日本の地域ブログ大集合！津々浦々の美味い・楽しいがここに！
2005年07月18日
だーしゃのCSS講座 ブログタイトルの色を変えてみよう！
だーしゃのCSS講座
第4回 ブログタイトルの色を変えてみよう！
こんにちは、前回はブログの構造につて説明をしました。
今回は第１回にヘッダーの画像の変更をアップしたので今回はそのヘッダー画像の中にある、
「ブログタイトル」と「説明」こちらの色の変え方をレクチャーします。
第4回 ブログタイトルの色を変えてみよう！
こんにちは、前回はブログの構造につて説明をしました。
今回は第１回にヘッダーの画像の変更をアップしたので今回はそのヘッダー画像の中にある、
「ブログタイトル」と「説明」こちらの色の変え方をレクチャーします。
■ブログタイトルの色の変え方。
まずこれが通常のブログタイトルです。
それからスタイルシート内で下記記述を見つけましょう～。
#banner a{color:#fff;text-decoration:none;}
#banner a:link{color:#fff;text-decoration:none;}
#banner a:visited{text-decoration:none;}
#banner a:active{}
#banner a:hover{color:#fff;text-decoration:underline;}
↑これがブログタイトルの色を指定しているスタイルシートです。
その中の赤文字に注目！これが色を指定している部分ですね！
「#fff = 白」
なので今ブログタイトルが白い文字なんですよ。
なので赤文字部分を
「#FF8C00 ＝ オレンジ」
に変えてみましょう～↓
#banner a{color:#FF8C00;text-decoration:none;}
#banner a:link{color:#FF8C00;text-decoration:none;}
#banner a:visited{text-decoration:none;}
#banner a:active{}
#banner a:hover{color:#FF8C00;text-decoration:underline;}
↓
はい！白い文字から沖縄からヨッシャー（＝＾＾）９
に変わりましたね！こういう風に色を変えていくんですよ～。
こちらはすべて同じ色にするのをオススメします。
そうしないとリンクの色とマウスオーバーした時の色などで変わってしまいますからね。
さて色はカラーコード表を参考にしてください。
■参照：カラコード表
上記のような要領で基本的に文字の色を変えたい時は
「color:#~~~~~;」 の部分を変えればOKです！
これでどこの文字の色も変える事ができますね！
さて、次回はこのブログタイトルの表示位置の変更の仕方をやります～！
それではまた次回！
だーしゃのCSS講座
この記事へのコメント
|
|
ありがとうございます～～ さっそくやってみました♪ 本当にわかりやすいし、 楽しいし、で感謝感激です＾＾ お気に入りの写真をとったら、 自分だけの画像にも挑戦してみま～す！ |
Posted by Urumai at 2005年07月19日 02:14
|
|
だーしゃさん、 先生になった方がいいと思う(笑) 私、聞かれても説明下手だから こんなにわかりやすく出来ないと思う。 カッコいいw |
Posted by なっちゃん at 2005年07月19日 11:35
|
|
こんにちは！ 私もさっそく色変えてみました！（もともとの緑から濃紺へ） ほっんといつもわかりやすい説明をありがとうございます。ペコリ |
Posted by sun at 2005年07月19日 11:49
|
|
こんにちは！はじめまして♪ 以前から知ってるふりして（誰に？(^▽^;) オリジナルデザイン登録見てたんですが、、 勉強したことないんで見てもわかるはずがなく（笑） できたことと言えば、続きを読むを変えたくらいでした。。 それが私もタイトルの色を早速変えてみました!! 色でまだ少し悩んでるんですが、自分で変えれた喜びで 今は満足してます(^-^) わかりやすい講座・解説（開設）ありがとうございます。 少しづつ頑張ってみようと思います♪ |
Posted by shiorin at 2005年07月19日 12:46
|
|
■なっちゃんさんへ こんばんは～！ みなさんのお役に立てればうれしい限りですよ～。 それだけでやってますから（＾＾）！ でもせんせは難しそうですね。。 でもおもしろいかもですね～ ■sunさんへ こんばんはぁ～！色変わってましたね！ ほんと色々とデザイン変えれるようになるとおもしろいですよ～。 次も作らないといけないですね！ がんばろう～！！ ■shiorinさんへ こんにちは！はじめまして！コメントありがとうございます～ スタイルシートやデザインを触れるようになるとなんだか楽しいですよね！ タイトルの色とかほんとイメージ違ってきますからね～。 是非色々とためしてみてください！ 僕も色々と講座開いてみましょうね～！ |
Posted by だーしゃ at 2005年07月19日 19:21
|
|
だーしゃさん、こんにちは～（●＾o＾●） カラーコード表うれしいっ！！ ほとんどHP作成に関して分かってないのですが 楽しそ～なので私も挑戦しようとしましたぁ♪ がっ！！ ごめんなさいっ 最初からつまづきました。 え～っとスタイルシートってどこにあるんでしょうか？？ こんなんでごめんなさいっ（（（（（（；＿ ＿）ノ 教えて下さい～ |
Posted by ハイジ at 2005年07月20日 14:09
|
|
■ハイジさんへ こんばんは！コメントありがとうございます～（＾＾）！ ブログのデザイン楽しいですよ～是非やってみてくださいね～。 スタイルシートについては管理画面、テンプレートページのサイドバー、 オリジナルテンプレートにありますよ。 是非おためしあれ！（＾＾）！ |
Posted by だーしゃ at 2005年07月20日 23:08
|
|
だーしゃさんへ 見つけました～！！ 最初は教えてもらったとこ見たけど似たような文字ばっかで よく分からなかったからあきらめかけでしたが。。。(ーoー;) いろいろ変えてみたけど、やっぱり元の色に近い パウダーピンクにしてみました。 見ためはほとんど変わってないけど やり方がわかったので嬉しいです。 ありがとうございますっ！！！（●＾o＾●）わーい♪ |
Posted by ハイジ at 2005年07月22日 22:45
|
|
■ハイジさんへ コメントありがとうございます。 できましたか~、やってみると簡単ですよね（＾＾）！ 最初は難しいかもしれませんが、一つ一つやっていけばできますので是非ご活用ください。よろしくです。 |
Posted by だーしゃ at 2005年07月23日 00:56
|
|
だーしゃさんのCSS講座すごくわかりやすくて早速、活用 させていただきましたよ～！ありがとうございます。m(__)m これからもドンドンお願いします。（笑） ところで、自分で変更したテンプレートの保存機能って あります？ |
Posted by yorix at 2005年07月24日 00:02
|
|
■yorixさんへ こんにちは～コメントありがとうございます～ 活用していただいて何よりです。 そしてテンプレートの保存機能はないですよね～ ＣＳＳをテキストでパソコンに保存するしかないですよ～ |
Posted by だーしゃ at 2005年07月24日 18:02
|
|
こんにちは（＾＾） タイトル部分の絵を変えたくてどうしたらいいものか・・と 友達に替えてもらったものの、自分でもいろいろいじりたくなり・・・ とりあえずタイトル文字の色変更ができて自信がついてきました（＾＾） これからもすこしづつ改造したいとおもいます。 どうぞよろしく・・・ |
Posted by amino at 2005年09月05日 04:45
|
|
■aminoさんへ こんにちは、コメントありがとうございます～ やっぱり自分でいじるのが一番楽しいですよね。 ゆっくりとですが、さほど難しくはないと思うので触って言ってみてくださいね～ どうぞ宜しくお願いします。 |
Posted by だーしゃ at 2005年09月06日 23:16
|
|
はじめまして！ｋｉｒａｒｉといいます!! あのですね、私のブログが変なんです・・・。 文字の色が変わらないし、プログのデザイン設定で『写真』の画像を 選択すると、サイドバーのプロフィールとかが一番下の方にあるんです。 ゆいつ、ちゃんとプロフィールも上に出てくれるのが ３カラム シンプルなんです。 だから写真とかイラストとかの設定が出来なくて困っています・・・ そうすればいいんでしょうか…?? 教えてください!! |
Posted by ◇◆kirari◆◇ at 2005年09月20日 15:21
|
|
■◇◆kirari◆◇さんへ はじめましてこんにちは！ コメントありがとうございますっ これはですね～。 ちょっとしらべてみたのですが、 「2005年09月06日：今日から・・・♪」という記事がちょっとおかしいですね～。 なので本文中の このお店で、私が狙っているのは<span style="color:#ff0033">皮の時計</span>です<span style="color:#ff9900">．☆．。．:*・° </span> の後ろに</div>を入れてみてください。 そしたらなおるはず！ そしてスタイルシートでもう一度タイトル挑戦してみてくださいね～ |
Posted by だーしゃ at 2005年09月20日 23:16
|
|
こんばんみぃ☆kirariです!! さっそく直してみました!!そしやら・・・スタイルシートが直りました!! 嬉しいです（≧▽≦）♪わざわざ調べてくれて、ありがとうございました!! 本当に嬉しいさァ～（≧▽≦）♪ さっそくデザインを『ハローウィン』に変えましたッ♪ また遊びにきます♪ |
Posted by ◇◆kirari◆◇ at 2005年09月21日 00:19
|
|
はじめましてこんばんわ～ だーしゃさんのブログをみて、オリジナルの画像をタイトルに入れる事に挑戦しました・・・（４時間かかりました）写真とタイトルと説明分色を変えてみましたが、まだまだ納得が行かないのですが・・・明日は仕事なので今日はここまでとします。講座とても分かりやすくて感謝です。 追伸 ブログタイトルの説明文は改行できるのでしょうか？ |
Posted by kako at 2006年02月10日 01:00
|
|
はじめましてこんばんわ～ だーしゃさんのブログをみて、オリジナルの画像をタイトルに入れる事に挑戦しました・・・（４時間かかりました）写真とタイトルと説明分色を変えてみましたが、まだまだ納得が行かないのですが・・・明日は仕事なので今日はここまでとします。講座とても分かりやすくて感謝です。 追伸 ブログタイトルの説明文は改行できるのでしょうか？ |
Posted by kako at 2006年02月10日 01:00
|
|
■kakoさんへ ご連絡おそくなりましたー。 ブログタイトルの件ですが、これは管理画面内ではできないんですよ。 ですが、オリジナルデザインで直接書くとできますよ。 ちょっとややこしいですが。。。。 |
Posted by だーしゃ at 2006年02月14日 13:35
|
|
始めまして～だーしゃさんｍ(＿ ＿)ｍ 密かに参考にさせていただきました 有難うゴザイマスｍ(＿ ＿)ｍ 又宜しくお願いします |
Posted by 月 at 2006年03月02日 23:22
|
|
月さん ドンドンやってみてくださいねー。 こちらまだまだわかりにくいかもしれないので、 もっとわかりやすく説明してみます！ よろしくです！ |
Posted by だーしゃ at 2006年03月14日 00:58
|
|
始めまして☆ 自分でやっていて、煮詰まった時にだーしゃさんのブログを発見！！ 記事を読んで謎が解けて助かりました。 で、質問なんですが・・・ コメント（書き込み部分）の色のみを変えるにはどうしたらいいんでしょうか？ 自分なりにやってみたら、サイドバーの文字色を変更するとコメントの文字色も一緒に変更してしまうんです・・・。 ◎サイドバー・記事文中のリンク先の色を変更 ◎プロフィール・カテゴリーの後の（）・・・などサイドバーの文字の色も変更 以上の変更をして、コメントの書き込み部分の色を元の黒のままにしたいんです・・・。 下手な文章でごめんなさい。 お忙しいとは思いますが、宜しくお願いしますm(__)m |
Posted by たゆき at 2006年07月21日 18:01
|
|
たゆきさんへ こんにちは！コメントありがとうございます！ 是非色々と活用してくださいねー！ そしてサイドバーのクラスが問題なんですよー。 んーとサイドバーのクラスを見つけてみてくださいーー よろしくです！ |
Posted by だーしゃ at 2006年07月24日 23:12
|
|
やってみます！ ありがとうございます☆ |
Posted by たゆき at 2006年07月25日 13:42
|
|
たゆきさんへ まずは慣れですが、すぐにできるとおもいますよー。 サイドバーに紹介してある、firefoxも活用してみてください。 よろしくです！ |
Posted by だーしゃ at 2006年07月27日 11:06
|
|
参考になりました！ 凄く感謝ですヽ('∀'*)ﾉ 琉球の島：BEL |
Posted by アフロきじむな～
at 2008年03月28日 18:52
at 2008年03月28日 18:52|
|
はじめまして 昨年からブログを始めました。一年たって、いろいろな部分をカスタマイズしてみようと思っていたところ、こちらのブログを紹介していただきました。 とてもわかりやすい説明で早速タイトルの色を変えることが出来ましたが、フォントがどうしても変わりません。プレビューで見ると変わっているのですが・・・ よかったら教えていただけませんか。 |
Posted by 辻徳 at 2008年11月28日 20:52
|
|
■アフロきじむな～さんへ トンでもないですよー、是非色々と活用してくださいー。 ■辻徳さんへ コメントありがとうございます。 そして色々と利用していただいて、ありがとうございます。 それからフォントの件ですが、こちらちょっとむずかしいんですよー フォントと言うのは、パソコンに入っているものなので、 自分のパソコンに入っていても、他の人のパソコンにはいってないと 表示できないんです。 いかがでしょうか、恐らくこんな感じだとおもいますー |
Posted by だーしゃ at 2008年11月28日 21:26
at 2008年11月28日 21:26|
|
早速お返事有難うございます。 おそらくどのパソコンにも入っている「ＭＳＰ 明朝」というものです。実際プレビューでは見られるので、問題は無いはず・・・と思うのですが・・・ CSSをどこか間違って削除したり、変更してしまったかもしれません。 直しようがないということかもしれませんね。自業自得ということで、、、 もっと知識があったらいいのにと残念に思いますが、今後も参考にさせていただきます。 |
Posted by 辻徳 at 2008年11月28日 22:25
|
|
■ 辻徳さんへ すみません、僕の認識がまちがっていたみたいです、 プレビューで見れているのに、実際では見れていないという現象は 確かにCSSに問題がある場合が多いです。 その際には設定しているスタイルシートの「font-family」か「textarea,select,input」の部分に入れ込む形になると思いますが、 いかがでしょうか。 すみません、僕自身もはっきりは分かりませんが、やってみてくだいです。 |
Posted by だーしゃ at 2008年11月29日 15:05
■沖縄からヨッシャー（＝＾＾）９新着記事
>>最新画像の一覧を見る￤>>ブログの記事一覧を見る
■各種オリジナルページへ
|
・ブログ記事一覧を見る |
・写真の一覧を見る |
・タグでの区分けを見る |
この記事へのトラックバックURL
この記事へのトラックバック
だーしゃさんのCSS講座★今回は、「ブログタイトルのカラーを変える」がテーマ！お？これならすぐできるかも？と、思って、早速やっちゃいました～～♪
さっそくやってみました＾＾【はいさい！うるまんちゅ★】at 2005年07月19日 02:11