CSS边框小于1px

可能重复：
HTML：子像素边框

border:1px太大了。 我想要有一半的大小，但我不知道该怎么做。 border: 0.5px solid; 不起作用。 我知道有一个与background img的解决scheme，但与CSS会更快。

Answer 1

像素是用于渲染某些东西的最小单位值。 但是，通过修改颜色，您可以通过幻觉来控制厚度。 （眼睛也只能看到一定的分辨率 。）

这里有一个testing来certificate这一点：

 div { border-color: blue; border-style: solid; margin: 2px; } div.b1 { border-width: 1px; } div.b2 { border-width: 0.1em; } div.b3 { border-width: 0.01em; } div.b4 { border-width: 1px; border-color: rgb(160,160,255); } 

 <div class="b1">Some text</div> <div class="b2">Some text</div> <div class="b3">Some text</div> <div class="b4">Some text</div> 

Answer 2

在屏幕上绘制比一个像素更薄的线是不可能的。 尝试使用更微妙的颜色来代替边框。

Answer 3

按照你的需要尝试给出0.1％的边界。

Answer 4

您的屏幕可以显示的最小宽度是1像素。 所以它不可能显示小于1px。 1个像素只能有1个颜色，不能分割。

Answer 5

你仍然可以定义边界属性，并给它一个0像素的值，当一边需要这个值时很有用。

例子：

 .box1 { border: 1px solid black; border-left: 0; } .box2 { border-color: black; border-style: solid; border-width: 1px 1px 1px 0; }