diadia

興味があることをやってみる。自分のメモを残しておきます。

セレクタの書き方

関連記事

css使い方


セレクタの書き方

セレクタはhtmlタグを単純に書くだけではない。

例えばheaderのh2属性のみにcssを適用したい場合には以下のように書く。

header h2{
          color : black ;
           }

リンクが青色で下線部が引かれている状態を直す場合

css

header nav ul li a{
             font-size : 20px;
             color : black;
             text-decoration : none;
                 }

idを用いたセレクタの書き方

セレクタはhtmlのタグだけでなく、タグ内の属性をセレクタとして利用できる。

その差異にはid名の直前に#を記述すること。

html

<h2>
    <input id="fullname" type="text">
</h2>

であるならば

    h2#fullname{
        font-size : 30px;
                }

classを用いたセレクタの書き方

idをセレクタとするときは#を使うのに対し、classを使う場合は.(ピリオド)を使う。

<h2 class="text_center">CSS使い方</h2>
<p>............................................................................................</p>
<h2 class="text_center">使用上の注意点</h2>
<p>................................................................</p>
<h3 class="text_center">例外</h3>

であるならば、

.text_center{
           text-align : center ;
                }

こう書くことでタグh2,h2,h3のテキストが中央寄せになる。