CSSのBorderやhrの水平線で1px未満の線を書きたい時
今回はCSSのBorderやhrの水平線で1px未満の線を書きたい時どのようにすれば良いのかについてご紹介いたします。
CSSのBorderやhrの水平線で1px未満の線を書きたい時
ブラウザやバージョンの問題もあるかもしれませんが、CSSのBorderやhrの水平線で1px未満の線を書けないときがあります。（書けないときが多いと思います）
小数点にしても反映されないときは反映されません。
そんなときどうすれば良いのかというと、確かにBorderで1px未満の線は書けませんが、「1px未満の線に見せる」ことができます。
その方法とは、線の色を薄くすることです。
線が太いと線の色はあまり変わらなく見えるかもしれませんが、線が細ければ細いほど、色を薄くしたときに1px未満の線に見せやすいです。
相当小さいですが下記にスクショを載せました。
上がcolorを「#000」にしたとき、下がcolorを「#AAA」にしたときです。
下のcolorが「#AAA」のものの方が線が薄く見えると思います。
小ネタに近いですが、覚えておいて損はありません。
ぜひ活用してみてください。
終わりに
今回はCSSのBorderやhrの水平線で1px未満の線を書きたい時どのようにすれば良いのかについてご紹介いたしました。