アメブロでインラインCSSを使って記事の本文を点線で囲む

8年前に投稿した「記事の本文を点線で囲む」について

最新版エディタで検証。

(1) 「HTML表示」に切り替え

(2) CSS記述を入れたHTMLタグを使って文字や文章を囲む

例）

<div style="border: dashed 3px #ff0000;">
記事本文
</div>

※例は 記事本文 の文字を3ピクセルの太さの赤い点線で囲む記述

↓↓↓実際の表示↓↓↓

記事本文

他の例。

<span style="background-color:#ffff00;">蛍光ペンのように黄色い背景色を入れる</span>

↓↓↓実際の表示↓↓↓

蛍光ペンのように黄色い背景色を入れる

<div style="width:50%; padding:10px; background-color:#ccffff; border-left:solid 5px #000099;">

記事幅の半分くらいの横幅で
付箋紙のような枠をつける
（左に濃い青の線を入れて枠内は水色）

</div>

↓↓↓実際の表示↓↓↓

記事幅の半分くらいの横幅で
付箋紙のような枠をつける
（左に濃い青の線を入れて枠内は水色）