<h2 vol="Vol.1">見出しのサンプル</h2>
タイトル付きの見出しです。
h2{
position: relative;
height: 50px;
line-height: 50px;
padding: 0 0 0 125px;
font-size:25px; /*文字サイズ*/
border: 1px solid #113250;
border-radius: 10px 6px 6px 10px ;
}
h2::before{
content: attr(vol);
position: absolute;
left: 0px;
top: 0;
padding:0 30px; /*タイトル部の長さ*/
font-size:20px; /*文字サイズ*/
background: #113250;
color: #fff;
border-radius: 6px 0 0 6px;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.