2

我需要在打印文档中画一条小的垂直分隔线。当我通过 CSS 类应用它时，它在 firefox 和 IE8 上运行得很好，但样式不适用于 chrome。样式在我的 css 文件的@media print 中。

.verticalLine1 
{border:0.5px #B1B1B1;
border-style:solid;
border-top-width:15px;
width:1px;
}

任何解决这个问题的指针？

4

3 回答 3

2

在你的 CSS 文件中试试这个：

.verticalLine1 {
    visibility: hidden;
    border: 0.5px #B1B1B1;
    border-style: solid;
    border-top-width: 15px;
    width: 1px;
}
@media print {
    .verticalLine1 {
        visibility: visible;
    }
}

并包含没有 media="screen"属性且没有任何 JavaScript 点击事件的 CSS 文件

<link href="styles/print.css" rel="stylesheet" type="text/css"/>
于 2012-11-28T09:38:22.707 回答
0

经过 2 天的悲惨经历，我无法找到适当的解决方案。但几乎没有其他选择

与代码内联编写样式非常完美。代码如下

<div style="border:0.5px #B1B1B1;border-style:solid;border-top-width:15px;width:1px;"></div>

由于以前的方法不是很好的编码实践，我被迫创建具有上述尺寸的图像，并将其添加为代码的一部分。

感谢 chrome.Atleast 它添加了图像，如果不是 css 的话。

于 2012-12-03T14:46:06.000 回答
0

为边框添加图像绝不是一个好主意。此外，您需要记住，chrome 会将十进制值截断为最接近的较低数字。由于这个 0.5px 将被解释为 0px 。我会建议使用 1px 而不是 0.5px。这将消除很多问题。

于 2015-08-07T07:12:12.607 回答