ラベル
キャプション
<div class="CG2-header1">
<div class="CG2-header1__heading">Heading text 1</div>
</div>
<div class="CG2-header2">
<div class="CG2-header2__heading">Heading text 2</div>
</div>
<div class="CG2-header3">
<div class="CG2-header3__heading">Heading text 3</div>
</div>
<div class="CG2-leadText">LeadText</div>
<div class="CG2-shortCentered">
<div class="CG2-shortCentered__inner">
短い時はセンタリング
</div>
</div>
<div class="CG2-shortCentered">
<div class="CG2-shortCentered__inner">
長いテキストは左寄せ長いテキストは左寄せ長いテキストは左寄せ長いテキストは左寄せ長いテキストは左寄せ長いテキストは左寄せ
</div>
</div>
Lorem ipsum dolor sit amet, consectetur adipisicing elit
Lorem ipsum dolor sit amet, consectetur adipisicing elit
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit</p>
<div class="CG2-holizontalLine"></div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit</p>
キャプション
<article class="CG2-article">
<div class="ImgBox">
<h1>ラベル</h1>
<p>キャプション</p>
<p><img src="http://img.pxgrid.net/1000x200"></p>
</div>
</article>
<article class="CG2-article">
<div class="Column">
<h1>コラムタイトル</h1>
<p>テキスト<a href="#">リンク</a>てきすと<code>code</code>テキストてきすとテキストてきすと</p>
<p><img src="http://img.pxgrid.net/1000x200"></p>
<p>テキスト<a href="#">リンク</a>てきすと<code>code</code>テキストてきすとテキストてきすと</p>
</div>
</article>
Autoprefixerに関しては、次の記事を参照してください。
「ビルドツールアラカルト」シリーズ
<article class="CG2-article">
<div class="Note">
<h1>*注:Autoprefixer</h1>
<p>Autoprefixerに関しては、次の記事を参照してください。<br><a href="">「ビルドツールアラカルト」</a>シリーズ</p>
</div>
</article>