吹き出し風の見出し
引き出し風の見出しです。吹き出し部分が下に向いていることで先に読ませようとする効果が生まれます。
見出し
Source Code
右上の「コピー」からご利用ください。
コピー
<div class="my-parts">見出し</div>コピー
.my-parts {
background: #B2EBF2;
padding: .4em .8em .3em;
margin: 0 0 1em;
text-align: left;
color: #000;
font-size: 24px;
font-weight: bold;
position: relative;
}
.my-parts::after {
position: absolute;
content: '';
top: 100%;
left: 30px;
border: 15px solid transparent;
border-top: 15px solid #B2EBF2;
width: 0;
height: 0;
}
