カバーバナー一旦開発完了

タイトル

Title

テキストテキストテキストテキストテキストテキストテキスト

クラス名

bl_coverBnr

マークアップ例

<div class="bl_coverBnr">
	<a href="#">
		<img src="" class="bl_coverBnr_img" />
		<div class="bl_coverBnr_onImage">
			<h2>COMPANY <small>会社案内</small></h2>
			<p>テキストテキストテキストテキストテキストテキストテキスト</p>
		</div>
	</a>
</div>
<!-- /.bl_coverBnr -->

定義

機能
画像の上にテキストを載せたリンクバナー
全体にリンク

あしらい・振る舞い
マウスオーバー時に文字だけがふわっと大きくなる
背景色、画像によって文字の色は変える可能性がある

特記事項
全体にリンクをかけず上に載る内容の一部にリンクをする場合はWPブロックのカバーを使うこと

 

ファイルパス

assets/scss/block/cover-banner

Change Log

  1. 開発開始:2021-08-22
  2. 最終更新:2022-10-19