html - cssを使った吹き出し教科書のしゃべり方の作り方

Question

正確に呼び出す方法がわかりません。これらは私が取り組んでいる例です。正方形と三角形の部分でhtmlとcssを使用してこれらすべてを作成することは可能ですか、それとも画像を使用するだけの方が良いですか

Answer 1

Yes it possible to make it using pure css but 

ブラウザごとに異なる結果が表示されます。CSSと画像の助けを借りることをお勧めします。

<div class="firstDiv">
    <div class="secondDiv"></div>
    <div class="arrowDiv"></div>
</div>

apply following css

.firstDiv { float:left; height:25px; width:200px;}
.secondDiv{ float:left; height:25px; width:170px; background:#666; font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:25px; color:#FFF;}
.arrowDiv { float:left; height:25px; width:25px; background:url(images/arrow.png) left no-repeat;}