通常にボーダーを作成したときは平面的に見えますが、ボーダー色を２色使うことで凹んだようなラインを作ることが出来ます。

見本では背景色を#ccccccにしてありラインの幅が1pxの#959595(グレイ系)と1px#ffffff（白）を使い作っています。

凹んだようなラインを使うことによってそれ以外が立体ぽく見えてオシャレな感じになりますよ。サンプルのライン色はこの背景色に合わせて色を調整してあるので、実際に作成される時は背景色に合わせて色を微調整して作成してください。

又ここではPhotoShopで作った見本ですが、通常のドローソフトでも簡単に出来ますんでチャレンジしてみてください。使い方次第では物凄くオシャレなページに変わると思います。

最終更新日: 2013年2月2日