WordPress 記事内の文章を枠で囲み見やすくする方法

Wordpress 文章を囲む

WordPress 記事内の文章を枠で囲む方法

Wordperssの記事を読むときに、文章を箇条書きにして、”すっきりと見やすくしたい!”と思うときがあります。

勿論、表を作成してその中に文章を入れればいいのですが、もっと手軽に枠で囲みたいと思ってしまう特が有ります。

具体的には、実際の使用例です。

実施方法は、下記のタグをコピーして、記事(テキストモード)に埋め込んでからビジュアルモードに戻して枠の中に文章を書くだけです。

<div style="padding: 16px; border: solid 3px #4169e1; border-radius: 10px; background-color: #f0f8ff; margin-top: 30px; margin-bottom: 30px;">ここに文章を入力します。</div>

ビジュアルモードでの見え方

ここに文章を入力します。

枠の中の「ここに文章を入力します。」の文章を変更して文章を複数行入力しても自動的に枠が下に伸びていきます。

枠線の種類の変更は、”border: solid”のsolid(実践)を変更します。
dotted(点線) double(二重線) dashed(幅広の点線) none(無し)

線の色の変更は、#4169e1の部分を#xxxxxxに変更してください。
色の見本コチラを参考に・・・色コード

 WordPress   (テーマ simplicity) ・HTML CSS へ戻る

=======================

初心者はネットで稼ぐために何をすべきか。

総合メニュー
Top (ブログの概要) 日々の実践記録
ネットで稼ぐための準備 オススメ情報
ネットで稼ぐ方法  ELP・お助け情報

  「ブログの概要」へ戻る

シェアする

フォローする

トップへ戻る