マトリョーシカ的日常スマートフォン用の表示で見るマトリョーシカ的日常ワクワクばらまく明日のブログ。2013-12-14はてなブログでタイトルや本文の文字色を変える方法ブログカスタマイズブログカスタマイズさて、食傷気味のブログ論はわきへ追いやってそれよりは幾分建設的なカスタマイズの記事を書こう。今日はブログの文字色の変え方を説明する。「そんなの分かってるよ」という意見もあるだろうがアクセス解析を見る限りでは少しは需要があるらしい。変更」とかで月に二、三人が来ているのだ。彼らを見殺しにするわけにはいかない。変え方は簡単、問題はどこを変えるか聡明なみなさんならブログ内の文字色を変えることくらいわけないだろう。color:#000000;こうやって書けば文字色を黒にすることができる。文字の色は十六進数を使って表現している。詳しくはこのページをみると分かりやすい。HTMLカラーコード問題はどこを変えるかである。以前デザインを変えようと思いはてなブログのソースを見たことがあるがあれはウェブデザインに疎い人にとっては呪文や迷宮のように感じるはずだ。このclassはどこまで続いているのか、idって何か。試行錯誤を繰り返しながらなんとか改装を完了した記憶がある。以下のサイトにははてなブログのclassとかidの構造が書かれている。色で分けられていて非常にわかりやすい。blogはてなブログで「デザインテーマコンテスト」が開催されています!オリジナルデ&...もっと早く知って入ればよかった。例:本文のリンク色の変え方それでは例を挙げて実際に文字色を変えてみよう。本文中のリンクの色をデフォルトの青にしたい人は結構いるはず。そんなときは上のサイトから「(記事本文)」と書かれているところを探す。「div.entry-content」であることが分かる。すると以下のように表せる。半角スペースを開けて「a」と入力する。名前の前に「.」や「#」あるがこれはセレクタがclassかidかの違いだ。ソース内で「id=~~」となっていたら頭に「#」、「class=~」となっていたら「.」とつける。複数のセレクタを同様に指定するには以下のように書けばいい。#00f;}例:タイトルの文字色、大きさを変更する次に(検索流入の多そうな)ブログタイトルのフォントの変え方を説明する。これは次のように書ける。font-size:130%;}また、タイトル下の説明文のフォントを変えるのは次にようにすればいい。font-size:90%;}設定が反映されないときは優先順位を確認することさて、いざデザインを変えようとはてなブログ内の"デザインCSS"をいじるも『いくらやってもうまく反映しない!」ということがある。これは記述内容の間違いというより優先順位が低いことが原因である可能性が高い。一般に同じCSSは後から書いた方が優先順位が高くなるがそれは獲得ポイントが同じ場合である。次のサイトを見てほしい。CSSの優先順位〜CSSテクニック〜CSSの優先順位はセレクタの獲得ポイントで決まるからです。獲得ポイントが少なければclassやidを指定していても効果を発揮しないことがあります。100ポイントつまり適用しているデザインテーマ内であらかじめ指定してあるデザインの方が優先順位が高いため、あなたが付け加えたcssが反映されないことがあるのだ。これを解決するには子孫セレクタを使えば良い。親要素の後に半角スペースを開けて子要素を記述する。#fdd35c;}それでもだめなら「important」を使えば良い。わかりにくくなるので多様は禁物。文字色」で検索するとずっと昔の僕のエントリがトップで出てきて驚いた。あれははてなダイアリーのときに書いたものなのではてなブログ用のエントリを書かねばとずっと思っていた。引きずっていたがやっと今日書くことが出来た。何かミスとか不具合とか分からないことがあればコメントで教えてください。週間)1989年生まれ。