＊
ブログを書いたりしてると、ここだけ枠で囲いたいなと思うときがあるよね。
そのたびに、調べてコピペするけど、終わったらいつの間にか捨てて（消して）、ありゃ？この前のどこにやったっけ…ってなる。
僕はもう、そんな過ちを冒したくないんだ。
シンプルな枠で文章を囲う
ここに本文
あっあっあっあっ
あっあっあっあっ
あっあっあっあっ
<p style="border:1px solid #888888; font-size:14px; font-color:#808080; line-height:120%; padding:10px; width:200px;">ここに本文 あっあっあっあっ あっあっあっあっ あっあっあっあっ </p>
- borderは線の指定。左から太さ、線の種類、色。
- fontサイズは文字の大きさ。
- fontカラーは文字の色。
- lineなんちゃらは行間。
- paddingは余白。
- widthはワイド。
角が丸くなる
ここに本文
あっあっあっあっ
あっあっあっあっ
あっあっあっあっ
<p style="border:1px solid #888888; font-size:14px; font-color:#808080; line-height:120%; padding:10px; width:200px; border-radius:10px;"> ここに本文 あっあっあっあっ あっあっあっあっ あっあっあっあっ </p>
- 角の調節は最後の10pxを変える。
文字のハイライト
ハイライト
<mark>ハイライト</mark>
シンプルなテーブル
| セル1 | セル2 | セル3 |
| セルa | セルb | セルc |
| セルd | セルe | セルf |
<table> <tr bgcolor="#f5f5f5"><td>セル1</td><td>セル2</td><td>セル3</td></tr> <tr><td>セルa</td><td>セルb</td><td>セルc</td></tr> <tr bgcolor="#f5f5f5"><td>セルd</td><td>セルe</td><td>セルf</td></tr> </table>
- セルの中に文字を書き換えます。
マーキー（ marquee ）
<marquee>あっあっあっあっあっ</marquee>
オマケ
<marquee width="201px" behavior="alternate" scrollamount="10" > ここに画像 </marquee>
- width（幅）は、画像サイズにプラス1pxしてください。
- アドセンス（広告）を揺らすとグーグル神が雷を落とします（たぶん）。
まとめ
うん。よし。
検索してると、やたら凝ったデザインが多くて困るよ。ぜんぶコピペしてペタっと貼ってもいいんだけど、パクった感があってなんかモヤモヤするし。
ここに集めたのは、なんの手も加えていない純真で無垢な子たちばかりなんだ。いつだって安心して抱きしめることができる。
CSS書けってのは、もっともなんだけど、そんなに頻繁に使わないし、反映されなかったときのストレスが尋常じゃないからね。
お役に立てば幸いです。
