素敵なキッチンアイテムや暮らしを彩る雑貨が揃うお店。
オンラインショップはこちら今だけ10%OFF
オンラインショップはこちら今だけ10%OFF
<!--▼▼▼▼▼ここから「素敵なキッチンアイテムや暮らしを彩る雑貨が揃うお店」--> <section> <!--飾りイラスト--> <aside class="c"><img src="../images/illust1.png" alt="" width="700"></aside> <h2 class="c">素敵なキッチンアイテムや暮らしを彩る雑貨が揃うお店。</h2> <p class="message">使いやすさとデザイン性を兼ね備えた、こだわりのアイテムをセレクトしました。<br> 毎日の家事が楽しくなるキッチン用品、お部屋をおしゃれに演出するインテリア雑貨、心ときめく小物まで。<br> お気に入りのアイテムを見つけて、心地よい暮らしを始めませんか?<br> あなたの毎日がもっと楽しく、もっと素敵になるような、とっておきの雑貨をお届けします。</p> <p class="c btn5-container mt"><a href="#" class="btn5 border-radius">オンラインショップはこちら</a><span class="fukidasi">今だけ10%OFF</span></p> </section> <!--▲▲▲▲▲ここまで「素敵なキッチンアイテムや暮らしを彩る雑貨が揃うお店」-->
cssフォルダのstyle.cssから「message」や「btn5-container」でテキスト検索してみて下さい。詳しい解説もあります。
単にhtml側に画像を配置し、widthで幅も直接指定しています。全部で同じ画像を3箇所配置していますがお好みの画像に入れ替えてもらってOKです。
画像を画面幅いっぱいにしたい場合は、widthの指定を削除すればOK。(※元画像がウィンドウ幅より小さいと画像の原寸大になります)
ボタン上のふきだしが不要なら
<span class="fukidasi">今だけ10%OFF</span>