CSS

疑似要素::beforeとposition、transformをつかってサイズの違うサイドバーの見出しにアイコンをつける方法です。なるべく簡単に更新や変更をするために、ちょっと試行錯誤した話です。

box-sizingプロパティのborder-boxとcontent-boxの違いを説明します。width250pxと指定されたときborder-boxとcontent-boxでは数値がどうなるか具体的に計算します。親要素や表示に必要なサイズを計算するのに役に立ちます。

スタイルシートの2つの余白であるmargin（マージン）とpadding（パッディング）の違いを、囲み線を作りながら体感してみましょう。余白と色を変えれば自分好みの囲み線でできますよ。id属性とclass属性についても説明しました。