Question

我的网页有边框，但我不希望打印边框。我已经尝试了一切，但无法弄明白。代码

CSS：

#pagy2 {
    background: #f3fff3;
    border:1px solid #c9dbab;
    width: 100%;
    margin-top: 28px;
    margin-left: auto;
    margin-right: auto;
    min-height:100% !important;
}

@media print
{
    .print_special { border: none !important; } 
}

HTML

<body>
    <div id="headercontainer" class="noprint"></div>
    <div id="pagy2" class="print_special">
        <div class="page">
            <h1>Title</h1>
            <table>
          <tr>

Answer 1

您需要覆盖最初设置它的选择器上的边框，如下所示：

@media print
{
    #pagy2 { border: none !important; } 
}

Answer 2

此解决方案适合我

@media print {

    * {
        color: #000;    
        background-color: #fff;
        @include box-shadow(none);
        @include text-shadow(none);
    }
}

Answer 3

你把这种风格放在样式表上的哪个位置？

如果你把它放在css的顶部，它将无法正常工作。将它移到css页面的底部。

Answer 4

我认为可以通过使用jquery来解决。

$(document).ready(function(){
    $('.print_special').css({ border : 'none'});
});

希望这能解决您的问题

JSFiddle URL :: http://jsfiddle.net/j83u4Ltr/4/

Answer 5

也许这会对你有帮助，或者你必须告诉我们里面的“noprint”/“page”css内容。

#pagy2 {
    background: #f3fff3;
    border:5px solid #000;
    width: 100%;
    margin-top: 28px;
    margin-left: auto;
    margin-right: auto;
    min-height:100% !important;
}

@media print
{
    #pagy2 { border: none !important; } 
}

<body>
<div id="headercontainer" class="noprint"></div>
    <div id="pagy2">
        <div class="page">
            <h1>Title</h1>
            <table></table>
		</div>
	</div>
</div>

打印时删除页面边框

5 个答案: