「CSSで見出しデザイン2」の編集履歴（バックアップ）一覧に戻る

CSSで見出しデザイン2 - (2015/05/29 (金) 09:01:35) のソース

前回記事[[CSSで見出しデザイン1]]の続き記事です。~
今回は疑似要素befor,afterを使った見出しの制作方法をご紹介します。
こんなもの~

~
~
目次
~
#contents


----
~
*疑似要素befor,afterをなぜ使う？
一般的な見出しはCSSでよく使われるプロパティ名を組み合わせただけです。例えばborder、border-left、border-bottom、border-radius、padding、padding-left、padding-bottom・・・。それらを組み合わせたり色を変えたりして作られています。しかし、その方法では、&color(red){簡単な丸を作ったり、三角形を作ったり、四角形を作ったり、あるいは四角形を回転させたりということはできません。それぞれの図形をCSSで描くことができれば、それをあとは載せてあげて、表示する順序を多少指定してあげるだけでできます。before、afterはそれができるのです。}
~
~
*