賢威8ではコンバージョン用のボタンとして以下の6種類をあらかじめご用意しています。
1 2 3 |
<div class="al-c m20"> <a href="#" class="btn dir-arw_r btn_orange"><span class="icon_arrow_s_right"></span>送信内容を確認する</a> </div> |
1 2 3 |
<div class="al-c m20"> <a href="#" class="btn dir-arw_r btn_bluegreen"><span class="icon_arrow_s_right"></span>送信内容を確認する</a> </div> |
1 2 3 |
<div class="al-c m20"> <a href="#" class="btn dir-arw_r btn_gray"><span class="icon_arrow_s_right"></span>送信内容を確認する</a> </div> |
1 2 3 |
<div class="al-c m20"> <a href="#" class="btn dir-arw_r btn_style03"><span class="icon_arrow_s_right"></span>送信内容を確認する</a> </div> |
1 2 3 |
<div class="al-c m20"> <a href="#" class="btn dir-arw_r btn_style01"><span class="icon_arrow_s_right"></span>送信内容を確認する</a> </div> |
1 2 3 |
<div class="al-c m20"> <a href="#" class="btn dir-arw_r btn btn_style02"><span class="icon_arrow_s_right"></span>送信内容を確認する</a> </div> |
なお、矢印を逆にしたい場合は「dir-arw_r」を「dir-arw_l」に、「icon_arrow_s_right」を「icon_arrow_s_left」にします。
また、賢威のアイコンを利用して以下のようにすることも可能です。
1 2 3 |
<div class="al-c m20"> <a href="#" class="btn btn_orange"><span class="icon_mail white"></span> 送信する</a> </div> |
1 2 3 |
<div class="al-c m20"> <a href="#" class="btn btn_gray"><span class="icon_caution yellow"></span> 必須項目が入力されていません。</a> </div> |