2023年4月20日アメブロでよく使う囲み枠を一覧にしています。リザーブストック(リザスト)の告知文にも、アメブロの囲み枠を使えます。基本的な囲み枠は使えますが、複雑なものは使えないものもありますのでご了承ください。囲む枠によってはブラウザが変わると表示も変わる場合があります。複雑なものはオススメしておりません。ここには自分の備忘録として、よく使うシンプルな囲み枠を置いておきます。原色大辞典はこちら→https://www.colordic.org/目次アメブロでもリザストでも使える囲み枠シンプルな囲む枠だけです。20px;"><p>文章<br>文章<br>文章</p></div>自分で色や太さを変えれたら、あとは自由に作成できます。2pxボディアート時代ちなみに以下のコードで作成してみました。20px;"><p>文章<br>文章<br>文章</p></div>ただ、このタイトル付き囲みわくはアメブロでは良いのですが、ワードプレスやリザストでは以下のようになります。タイトルと囲み枠が分離します。アメブロでは問題ないようです。ワードプレスは、ワードプレスのテーマに付いている囲み枠の方がオススメです。他のコードの方が良いのかもしれません。(また探してみます)※何度も他のタイトル付き囲み枠を試してみましたが、リザストで綺麗に表示されるものはありませんでした。ボディアート時代リザストに使うならシンプルな囲み枠がオススメです。以下のはアメブロでは使えましたが、リザストでは表示されませんでした。単純なのはただの直線での囲み枠です。3種類載せておきます。囲みわくは使うWebサービスやブラウザで、崩れる場合があるので、シンプルなこちらの方が良いと思われます。0;">ここに文章<br>文章</p></div>コードも簡単です。ちなみに線を細くしてピンクにしますコードはこちらです。0;">ここに文章<br>文章</p></div>paddingは枠からの余白なので、余白を20pxにして、今度は線を太く(5px)します。0;">ここに文章<br>文章</p></div>コードの意味がわかるとある程度自由に作成できます。0;">文章<br>文章</p></div>今後はドットを大きくして(3→8)、色も変えて(#db7093)余白を大きくします。(15→20)コードはこちらです。0;">文章<br>文章</p></div>次に二重線の囲み枠です。0;">ここに文章<br>文章</p></div>あとは色や太さを変えると良いでしょう。上記の囲み枠をリザストに入れた場合の例をこちらに載せました。やまがみ最初の部分はリザストにデフォルトで入っていたテンプレートです。下の方に上記の囲み枠を載せました。リザストのテンプレートを全て削除してシンプルにするリザストのランディングページ(告知文)は、最近とてもオシャレになっています。文字や写真が動いたり、オシャレなフォントを選択できたり・・・ただ、最初から入っている文章等を使うと、プレビューで確認した時に文字の大きさが揃っていなかったりします。利用の仕方によってはHTMLが影響していたり、いろんな原因があるので、自分で解決できない方はシンプルなランディングページにすることをオススメしています。そのやり方は別の記事に掲載しておきます。50代60代の起業する女性を応援、ネット集客スタートアップコンサルティングのヤマガミです。必要なのは貴女の行動力とやる気だけ!本当の個人事業の育て方はシンプルです。人を呼ぶWebサービスの使い方〜実例から学ぶ勉強会〜(有料)2022年8月22日ユーザー名とパスワードは、サードパーティのサイトまたはアプリで危険にさらされています。