cssカスタマイズ

皇国ノ興廃此ノ一戦ニ在リ、各員一層奮励努力セヨ

◆borderで描く


◆html
<div class="z-flag"></div>

◆css
.z-flag
{
width:0;
height:0;
border-top:150px solid #ffff00;
border-right:225px solid #003399;
border-bottom:150px solid #ff0000;
border-left:225px solid #000000;
}

.z-flag
{
width:0;
height:0;
border-width:150px 225px;
border-style:solid;
border-color:#ffff00 #003399 #ff0000 #000000;
}

CSSだけで三角形を作ろう！
　その1：borderプロパティの仕組みをマスター
　その2：吹き出しやリボンをデザインする