囲み罫」タグアーカイブ

囲み枠の表示をHTMLからCSSへ。

以前のHTMLでの囲み枠で最後の行と枠との隙間が気になり色々弄ってみたのですが、僕の力では解決できず。

CSSによるスタイル指定に変更。

カスタムCSSに以下のコードを追加。
参考サイト。

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

サルワカさん、ありがとうございます。
サルに近い僕には必要なサイトです。

※CSSのコードを追加する時は Simple Custom CSS が解りやすく便利です。

◆CSS

.box2 {
padding: 0.5em 1em;
margin: 2em 0;
font-weight: bold;
color: #6091d3;/*文字色*/
background: #FFF;
border: solid 3px #6091d3;/*線*/
border-radius: 10px;/*角の丸み*/
}
.box2 p {
margin: 0;
padding: 0;
}

CSSよ呼び出すHTMLは以下の記述。

◆HTML

<div class=”box2″>
<p>ここに文章</p></div>

サンプル文章▼

以前のHTMLでの囲み枠で最後の行と枠との隙間が気になり色々弄ってみたのですが、僕の力では解決できず。
CSSによるスタイル指定に変更。
カスタムCSSに以下のコードを追加。