CSSに挑戦

といっても、超初級編です。

ずっと記事のタイトルの色と大きさが気になっていました。
以前は、タイトルと見出しが同じ大きさで、
タイトルが青、見出しが黒と、どう見てもタイトルより見出しの方が目立っていました。
そこで今回は、タイトルを少し変えて、目立つようにしました。

.article-title a {
color: #000000;
        background-color: #bbccdd;
        font-size: 35px;
font-weight: bold;
letter-spacing: 1px;
text-decoration: none;
}

ライブドアブログで記事タイトルは、「article-title」というクラス名になっています。

上のCSSで変えたところは、赤のところだけです。
まず、
color: #000000;
でタイトルの時の色を黒に、
background-color: #bbccdd;
でタイトルの背景色を薄い青にしました。
次に、
font-size: 35px;
でフォントサイズを20pxくらいから35pxにしました。

これでタイトルがよりタイトルらしくなったと思いますが、いかがでしょうか?

ちょっと解説
色を指定するときは、RGB(赤、緑、青)を16進法の数字2桁ずつで表します。
16進法は、0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f と数が進んでいきます。
つまり、9は「09」、10は「0a」、15は「0f」、16は位が上がって「10」となります。
16進法だと2桁で「00」(10進法の0)から「ff」(10進法の255)まで指定できます。
#000000だと、赤=0、緑=0、青=0を合わせた色なので、黒が出力されます。
コンピュータは光の三原色です。
ほかにも、赤を指定する場合、
#f00
rgb(255,0,0)
rgb(100%,0%,0%)
red

といった表し方もあります。

pxというのは、ピクセルのことで画面の上の点の数を表します。

この記事が気に入ったら
フォローしてね!

よかったらシェアしてね!

コメント

コメントする

ジャンプできる目次
閉じる