多重線BOX

ボックスに枠線を引く場合は、単線ならborder: 2px solid #f00; 二重線ならborder: 3px double #f00; というふうに書けばよいですが、多重線を描く場合にはどうすればいいのでしょうか?

実は、box-shadow(inset) を使用すれば、簡単に多重線を描くことが可能です。

box-shadowって、カンマで区切ればいくらでも足せるんですよね。

というわけで、下に例を表示してみます。

多重線BOX

あいうえお

あいうえおあいうえおあいうえおあいうえお

あいうえおあいうえおあいうえお

影付き多重線BOX

あいうえお

あいうえおあいうえおあいうえおあいうえお

あいうえおあいうえおあいうえお