(1)基本のスタイル編・全体像①(2017年版新CSS編集用デザイン)
|
この解説は2016年3月に追加された新CSS編集用デザイン用のカスタム解説です。
(1) 基本のスタイル(新CSS編集用デザイン解説)
では解説です。
(1)基本のスタイルの部分では、ブログ全体のテキストの編集と、ブログ背景、そして境界線の設定ができます。
以下がコードになりますが、下記はブログ全体を変える要素なので、変更すると全てが変わってしまいます。たとえば、下記9行目の「地色テキスト」でブログの文字色を変更しますが、記事本文や、サイドバーにまで影響してしまい、のちのちのカスタマイズに影響しかねません。ですので、ここではそういうカスタマイズは別のところで個別に解説し、ふたつに絞って解説します。
ひとつめは、文字フォントの設定
フォントをメイリオフォントにします
そして
もうひとつは、ブログの背景の設定
ブログの背景色の設定方法の解説です
では、次のセクションでブログ文字のフォント設定について解説します。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 |
/**:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::* (1)基本のスタイル *:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::* */ /* (1-1) 基本テキスト全体 --------------------------------------------*/ /* 地色テキスト */ html { color: #333333; } /* リンク */ a { color: #3970B5; } /* 訪問済みリンク */ a:visited { color: #a27ea2; } /* 淡色テキスト */ .skin-textQuiet { color: #999999; } /* 強調色テキスト */ .skin-textLoud { color: #ff3399; } /* (1-2) 基本背景 --------------------------------------------*/ /* コンテンツ背景、ヘッダー以下の背景色 */ .skin-blogBody, .skin-blogBodyInner { background-color: #ffffff; } /* 淡色背景, 自分のコメントエリアの背景色 */ .skin-bgQuiet { background-color: #f7f7f7; } /* (1-3) 基本境界線 --------------------------------------------*/ /* 境界線(強) */ .skin-borderLoud { border-color: #cccccc; } /* 境界線(弱) */ .skin-borderQuiet { border-color: #e5e5e5; } |