テキストを枠付きで表示します。強調する文章等に利用できます。テキストを枠付きで表示します。強調する文章等に利用できます。
とても綺麗で見やすいレスポンシブデザインで親しみを感じるデザインです。このデザイン枠は、シンプルですがとてもインパクトのあるデザインです。
あなたの工夫次第で、一言コメントや重要な告知やお知らせに向いています。何を見せるかが重要な話題になるのでしょう。
今はスマホの時代となりましたから、誰かが撮った写真やイラストなどネットにたくさん掲載されています。
さーて何を表現するかは、あなたしだいです。
1 2 3 4 5 6 7 8 |
<!-- タイトル付き囲み枠テキスト --> <div class="framed-text green"> <div class="framed-title green">装飾用のデザインボックスについて</div> テキストを枠付きで表示します。強調する文章等に利用できます。テキストを枠付きで表示します。強調する文章等に利用できます。 とても綺麗で見やすいレスポンシブデザインで親しみを感じるデザインです。このデザイン枠は、シンプルですがとてもインパクトのあるデザインです。 あなたの工夫次第で、一言コメントや重要な告知やお知らせに向いています。何を見せるかが重要な話題になるのでしょう。 今はスマホの時代となりましたから、誰かが撮った写真やイラストなどネットにたくさん掲載されています。 さーて何を表現するかは、あなたしだいです。 |
1 |
.framed-text.green {color: #222; border-color: #2daa3f; background-color: #F2FBF4;} |
テキストを枠付きで表示します。強調する文章等に利用できます。テキストを枠付きで表示します。強調する文章等に利用できます。
日本人にとって桜は特別な花です。
近くの公園の桜よりも、名所と呼ばれるところの桜を見たくなります。関東の桜が特別にいいわけではありませんが、どこもたくさんの人が集まります。
桜を見ることができる期間は長くありません。その時、どこの桜を見るかが重要な話題になるのでしょう。
今はスマホの時代となりましたから、誰かが撮った桜がネットにたくさん掲載されています。しかし、桜の名所は自分で見ることが重要なのです。
穴場を探して、ゆっくりと桜を見たいと思うのは当然なのでしょう。
1 2 3 4 5 6 7 8 9 |
<div class="framed-text pink"> <div class="framed-widetitle pink">桜の名所について調べてみました!!</div> <p><strong>テキストを枠付きで表示します。</strong>強調する文章等に利用できます。テキストを枠付きで表示します。強調する文章等に利用できます。<br> 日本人にとって桜は特別な花です。<br> 近くの公園の桜よりも、名所と呼ばれるところの桜を見たくなります。関東の桜が特別にいいわけではありませんが、どこもたくさんの人が集まります。<br> <strong>桜を見ることができる期間は長くありません。その時、どこの桜を見るかが重要な話題になるのでしょう。</strong><br> 今はスマホの時代となりましたから、誰かが撮った桜がネットにたくさん掲載されています。しかし、桜の名所は自分で見ることが重要なのです。<br> 穴場を探して、ゆっくりと桜を見たいと思うのは当然なのでしょう。 </p></div> |
1 |
.framed-text.pink {color: #222; border-color: #FF6699; background-color: #fff7fa;} |
・オプション設定時テキストが表示されます。
・オプションテキストのリンク設定は、「テキストのリンク設定」をご確認ください。
1 2 3 |
・オプション設定時「再入荷のお知らせを受け取る」は、品切れのオプションを選択した際に表示されます。 ・再入荷のお知らせ設定は、<a href="https://popmedia.jp/" target="_blank">オンラインマニュアル「再入荷のお知らせ通知設定」</a>をご確認ください。 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
.post-point:before{ content:"POINT"; background:#255F85; position:absolute; left:-50px; top:-5px; width:65px; height:65px; color:#fff; line-height:65px; border-radius:50%; text-align:center; font-family:Arial, Helvetica, sans-serif; font-weight:bold; font-size:14px; } .post-point{ position:relative; min-height:70px; padding:8px 24px; border:1px dashed #255F85; margin:0.5em 0 3em; color:#255F85; background:#fffbe6; } .post-point-top{ margin-top:3em; } |