blogger QooQ 文章の中に枠囲い

記事を書いていて、文章の中に枠囲いをしたくなりました。

しかし、bloggerの編集画面には、そのような機能がついていません。

そこで、調べたところ、

HTML編集画面で、直接このような記述をすればよいことがわかりました。

<div style="display:inline-block;　background: #FFFFFF; border-radius: 10px; border: 2px dotted #111111; padding: 10px;color: #00BCD4;">このように表示されます</div>

そうすると

それぞれのパラメータをさわればいろいろな枠にできます。

    display:inline-block; ←枠の幅

    background: #FFFFFF; 　←背景色

    border-radius: 10px; 　←境界の外側の角を丸めます。

    border: 2px dotted #111111; 　←線のスタイルと色

    padding: 10px;　←ボックスの枠線と中身の間隔

    color: #00BCD4;　←文字の色 

参考

GOOGLE BLOGGERの設定：HTMLコードで文字に囲み枠【無料】

https://unknown-blg.blogspot.com/2019/07/blogger5.html

border-radius

https://developer.mozilla.org/ja/docs/Web/CSS/border-radius

border-style

https://developer.mozilla.org/ja/docs/Web/CSS/border-style

ボックスのボーダー・パディング・マージン

https://az-store.nrym.org/archive/mynotes/lecture/html-css/css2-2

【CSS】displayの使い方を総まとめ！inlineやblockの違いは？

https://saruwakakun.com/html-css/basic/display

【CSS】おしゃれなボックスデザイン（囲み枠）のサンプル30

https://saruwakakun.com/html-css/reference/box