【初心者向け】テキストを枠で囲む方法(引用タグ・コピペで OK)【新エディタ対応】 | アメブロデザイン制作サービス@シンクマックス

アメブロデザイン制作サービス@シンクマックス

オリジナルデザインで印象に残るビジネスブログを作りましょう!

今回は、本文中に引用部分(囲み枠)を作る方法についてです。
と言っても、どういうものかイメージが湧きづらいかもしれませんので、
下に実例を用意しました。

- * - * - * - * - * - * - * - * - * - * - * - * - * - * - * - * - * - - * - * - * - * - * -* - * - * -

こういう枠を付けたい時のテクニックについて

コピペでできますよ。

1.普通に記事を書いていき、枠で囲みたいところができたら、「HTML 表示」タブに切り替えます

上部の表示をクリックすることで切り替えられます。

9-1引用タグbr>

2.枠で囲みたいテキストを、以下のタグで囲みます

<div style="border: 1px dashed #CCCCCC; padding: 15px;">枠で囲みたいテキストを入れます</div>

9-3引用タグ

3.「通常表示」に切り替えて確認します

意図したように枠で囲まれているかどうか、確認してみてください。

9-3引用タグ


- * - * - * - * - * - * - * - * - * - * - * - * - * - * - * - * - * - - * - * - * - * - * -* - * - * -

「HTML 表示」に切り替えると入力した文字以外にいろいろくっついていますが、
怖いものではありません。ただ、不用意に消さないように気を付けてください。
この引用を使った記事は、こちらで確認できます(テスト用ブログ)。

次回は、この囲みのバリエーション(色違いなど)について書いていきます。