HTML 枠で囲む

HTML  文章を枠で囲む

よく見ると思いますが、文章を枠で囲み、更には背景色を付けると、かなり注目してもらえると思いませんか?

 

それもコピペで出来ればいうこと無し。それでは、行ってみましょう。

 

 

これを昨日説明した、ワードプレスの「テキスト」に貼ると

 

文章はここです。

次は、

 

「solid」を「double」にすると二重線

文章はここです。

更に、

 

「dotted」にすると点線

文章はここです。

後何を変えたいですか?

 

border-radiusを0pxにしてみます。

文章はここです。

角のまるみが無くなりました。色も変えますか?

 

borderは外枠の線ですね。backgroundは背景色。

文章はここです。

色に関しては、
http://www.colordic.org/
で調べるのが便利です。

 

最後にあなたが最初から気になっているものを変えましょう。

 

width: 150px;を足してみました。

文章はここです。

どうですか?

 

どんどん使ってください。