[ CSS3 ] 一つのdivで菱型を作る

Yukimi Sato 217views 更新:2014年5月26日
.hishigata{
width:0px;
height:0px;
border-top:15px solid transparent;
border-left:0px solid transparent;
border-right:30px solid #000000;
border-bottom:15px solid transparent;
-webkit-box-reflect:right;
}
<div class="hishigata"></div>

「-webkit-box-reflect:right;」で、描写した三角形を反面コピー表示することができます。

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません