CSS3 borderで色々な図形を作成してみました。

CSS3 三角形 ひし形 等の作成方法のエントリーを参考にborderで色々な図形を作ってみました。 では、復習。 borderで三角形を作る HTML <div class="shape01"></div> HTMLの要素は1つのみ用意。 実際、図形やアイコン作成の為、DOM要素を沢山記述してしまうと、パフォーマンスも悪く、SEO的にもよろしくありません。 図形作成対象の要素はDiv以外のp要素等でも問題ありません。 css3 .shape01{ height:0px; width:0px; border:50px solid #000; border-color:transparent; border-top-color:#000; } が出来ると思います。 これを発展させ、以下のような図形を作ってみました。 どれも1,2行ほどソースを加えたりしただけのものなので、 簡単に作成する事が

[site159]

CSSのborderで図形を書くサンプル