use*_*673 14 css printing-web-page
如果我有一个打印CSS样式元素:
border:1px solid black;
要么:
border:0.25pt solid black;
打印时线条很厚 - 至少1pt.如果我尝试使用更小的值,例如0.05pt,则该行根本不会出现.我怎么能得到一条细线？在像InDesign这样的程序中,您将"发丝"的厚度设置为0.25pt,即非常细的线条,但不能太薄以至于无法打印.
注意:这个问题似乎问了同样的问题,但是没有人解决线厚度的实际问题,只是使用的最佳测量单位: pt或px用于指定打印的边框宽度
use*_*673 11
谢谢你的帮助.在这方面,浏览器似乎毫无用处.
我做了一些测试,结论似乎是:
我测试了以下网页的变体,每次调整边框点大小.我打印出'fit to page'关闭.
<html>
<body style="width:17cm; background-color:rgb(245,245,245);">
<div style="border:0.3pt solid black; width:100%; height:20cm">IE 0.3pt</div>
</body>
</html>
这些是最小可打印点大小的结果,以及与InDesign中的行打印输出相比的结果.我也包括了一些其他笔记:
FF:0.25pt,看起来像1.25pt.DIV宽度看起来像是17厘米,但由于FF的大量打印边缘,右侧边框被切断.似乎16.5cm是最大的可用宽度.BODY高度适合页面的高度.
Safari 5:0.75pt,看起来像1pt.DIV宽度为18.2厘米,BODY宽度为19.5厘米 - 即使没有迹象表明它会这样做,Safari似乎也适合页面.在DIV高度后不久,BODY高度结束.
歌剧11:0.4pt,看起来像0.75pt.DIV宽度为16.2厘米,BODY背景仅出现在div中 - 尽管文本行显示在白色背景上
IE7:0.4pt,看起来像0.5pt(和0.5pt一样).与FF一样,DIV宽度看起来像是17厘米,但由于IE的大量打印边缘,右侧边框被切断.
IE9:0.1工作(可能更低),但仍然看起来像0.5pt.否则与IE7相同.
如今,在2015年,有一些使用HTML5和CSS3 生产细线的解决方法,例如用于打印或在高分辨率屏幕上:
stroke-width: .5)的缩放方法详细描述于本文中.归结为:
hr.thin {
height: 1px;
border-top: none;
border-bottom: 1px solid black;
transform: scaleY(0.33);
}
的线性梯度方法沿着这些线的工作原理(双关语意,在这里详细):
hr.hairline {
height: 1px;
background: linear-gradient(
transparent 0%,
transparent 50%,
black 50%,
black 100%);
}
为简化起见,我以1px <hr>元素为例.但是,通过分别缩放元素中的所有样式或分别使用多个背景,可以扩展两个解决方案以作为元素的所有四个边上的边界.