peeks-blog

自分用メモ

擬似クラス

一番右側の子要素を右端に寄せる方法としては
「ko:last-child」という擬似クラスの書き方がポイントになる。

擬似クラスとは、要素が特定の状態
（子として最後の要素）にある場合にスタイルを指定するもの。


・「a:hover」や「a:visited」などが有名
→ホバー状態や訪問済みリンクの時に、同じaタグでも別々のCSSを当てる事ができる。
→マウスカーソルを載せる（ホバーする）と、下線を出したりも出来る。
→まだ訪問してないリンクは青、訪問したリンクは紫にする等の使い方がある。

ただし、擬似クラスや疑似要素に関しては、
サポートしてないブラウザもあるので注意する。

★擬似クラスや疑似要素で出来ること
①前後に何かくっつける
・「:before」と「:after」など
②リストの装飾で特定行だけ指定できる
③floatの解除

box-sizingについて

paddingを設定すると、ボックス自体の大きさが変わる問題がある。
そこで便利なのがbox-sizingである。
これは、最初に指定したwidthとheigthの範囲内で
paddingやborderを設定できる機能である。

この画像のbox-sizingは、
「paddingを含めてwidthが980px」という意味を表している。
もしbox-sizingが含まれてない場合、
親要素のwidthはpaddingの幅分増えるので要件通りにならなくなる。

setIntervalについて

「★秒ごとに●回表示」をjavaScriptで実現するには、
setIntervalメソッドを用いる。

以下の画像は、１秒（1000ミリ秒）ごとに
数値を0から１ずつ出力していくもの。