これはH1タグです
これはPタグです。
これはH2タグです
これはH3タグです
これはH4タグです
これはH5タグです
これはH6タグ class=”green”です
これはH6タグ class=”blue”です
これはH6タグ class=”gray”です
↑<hr>
コンテンツの2分割
色度ばらつき調整あり
色度ばらつき調整なし
↑このようにコンテンツを2つに分ける時は、 <div class=”split-2″></div> を使います。
ソースコード
コンテンツの3分割
導光体使用製品
導光体
光学レンズ部品
コンテンツを3つに分ける時は、 <div class=”split-3″></div> を使います。
ソースコード
導光体使用製品
導光体
光学レンズ部品
<div class=”split-3 img-list-box”>
のように、”img-list-box”をクラスに追加すると、個々のコンポーネントがグレーのボックスで囲まれます。
ソースコード
画像キャプション
これは画像キャプションです
<img src=”/wp-content/themes/oshino/images/light-guide/page-lightguide-001.jpg”>
<span>これは画像キャプションです</span>
このように、画像の次に<span>タグのコンテンツがくると、画像のキャプションとなります。
ボタンコンポーネント
自動車専用光学製品はこちら
<a class=”button-black-white button-center”>自動車専用光学製品はこちら<i class=”flipicon-ff right”></i></a>
class=”button-center”を足すと、センタリングされます。（親要素にpositionが設定されている場合のみ）
<a class=”button-main-white” id=”megamenu-contact”><i class=”flipicon-mail”></i>お問い合わせ</a>
<a class=”button-border-white”>TOP<i class=”flipicon-ff right”></i></a>
PDFへのリンク
<a href=”test.pdf” class=”button-center”>PDFへのリンク</a>
拡張子がpdfの場合、自動的にボタン化。アイコンも自動付与。
