Simplicityのデザイン変更に挑戦中

スポンサーリンク

このサイトのデザインがまだまだチープなので、
もうちょっと綺麗なページにしたいなぁ、と
参考になりそうな、それでいて簡単に出来そうなものを
試している最中です。

どの様にしたら、この無機質なページを、
「誰かデザイナーさんとかに頼んで作って貰ったん?」
みたいなものに出来ないもんかと(’’


スタイルシート(style.css)、ってのをいじれば良いっぽいんだけど、
なんか上手くいかないんですよね・・・(--;

“style.css” 自体は、
「外観」→「テーマの編集」
を選択したら出てきたんですけどね。
そこに、
———
.article h2 {
background-color: #F0F0A0;
border-left: 0 none;
color: #338;
padding: 15px 30px;
}
———
みたいなコードを追記したら良いっぽいって書いてあったから
やってみたんですが、上手くいかない!

んー、どーしたら上手くいくんだろ・・


あれ、他のは反映された。
「トップページの記事間にラインを引く」
「関連記事間にラインを引く」
「見出し h3」
の3つ。

「見出し h2」だけ、上手くいかん・・・

———
/* トップページの記事間にラインを引く 20151005 */
#main .entry {
border-bottom: 1px dotted #203333;
padding-bottom: 15px;
}

/* 関連記事間にラインを引く 20151005 */
#main .related-entry {
border-bottom: 1px dotted #203333;
padding-bottom: 15px;
}

.article h2 {
background-color: #87B196;
border-left: 0 none;
color: #fff;
padding: 15px 30px;
}

.article h3,
#comment-area h3,
#related-entries h3{
font-size:21px;
border-bottom:5px solid #87B196;
padding:10px 0;
}

———

ほぼコピペなんだが・・・

ちゃんとcssの文法?を解説しているサイトを見よ・・・


<追記>
こんな紹介サイトを見つけた。
少しの労力でサイトをかっこよく!見出しのCSSデザインに役立つジェネレーター&サンプル集30個まとめ -寝ログ-

いっぱいありすぎ(^^;

まぁ、ちょっとずつ見てみるか~



参考になった、共感できた、などありましたら、
"応援クリック" を頂ければ嬉しいです!
   ↓ ↓
にほんブログ村 メンタルヘルスブログ うつ病(鬱病)へ
にほんブログ村へ

人気ブログランキングへ

このエントリーをはてなブックマークに追加
スポンサーリンク

シェアありがとうございます!

フォローはこちらからどうぞ!