アメブロ使い方~テキストの枠の外観を変えるサンプル(詳細手順あり)

最終更新: 2018年11月20日

前回の記事で、アメブロ内で引用や強調として、テキストに枠を付ける方法について解説しました。今回は、枠の外観を変えるサンプルを一部紹介します。

これを基本として、色や線の太さなどを自由に買えてみてください。


1.枠のサンプル

枠内にも書いてありますが、点線・実線・背景色のサンプルです。



2.コピー&ペーストするテキスト


<div style="border: 1px dashed #CCCCCC; padding: 15px;">点線で枠線が付けられます</div>


<div style="border: 1px solid #000000; padding: 15px;">これを使うと実線の枠が付けられます</div>


<div style=" background:#e9f3fe; border:none; padding: 15px;">背景に色を設定することもできます</div>



3.点線や実線、色の指定について

「dashd」は点線、「solid」は実線、「background」は背景色の指定に使います。また、「#000000」は、色の指定を行っています。カラーコードからお気に入りの色を探すことで、好きな色や線の種類で枠が作れます。試してみてくださいね。

「1px」は線の太さなので、この数字を大きくしていくと、より太い枠線が作れます。

16回の閲覧