如何解决div的边框即使在打印时也没有显示?
我想用边框打印div,该边框在html页面中可以正常工作,但在打印预览中该边框不显示。
即使我为<div class="sfborder">
添加了内联css,这也无法得到正确的输出,我该如何解决呢?
<style>
.sfborder {
border: 1px solid black !important;
border-collapse: collapse !important;
border-radius: 2px !important;
margin-bottom: 10px;
overflow: hidden;
}
@media print {
.sfborder {
border: 1px solid !important;
border-collapse: collapse !important;
border-radius: 2px !important;
margin-bottom: 10px;
overflow: hidden;
}
}
</style>
<div class="row">
<div class="col-sm-12">
<div class="sfborder">
<div class="col-sm-4">
<h6 class="text-info">Quote to</h6>
<h6>Kadamba India Technologies PVT LTD</h6>
<p>'Kasturba Nagar,Mysore Road,Bangalore - 560026</p>
</div>
<div class="col-sm-4">
<h6 class="text-info">Ship To</h6>
<h6>Kadama India Technologies PVT LTD</h6>
<p>'Kasturba Nagar,Bangalore - 560026</p>
</div>
<div class="col-sm-4">
<div class="col-sm-12">
<h6 class="text-info">Delivery Terms</h6>
<p>Advance</p>
</div>
<div class="col-sm-12">
<h6 class="text-info">Payment Terms</h6>
<p>Against Delivery</p>
</div>
<div class="col-sm-12">
<h6 class="text-info">Other Reference</h6>
<p>Shipping charges extra</p>
</div>
</div>
</div>
</div>
</div>
解决方法
我能问一下为什么您要在CSS中使用@media打印吗?我个人将其保存在同一文件中,还是只将css文件不使用@media打印{ }
<style>
.sfborder {
border: 1px solid !important;
border-collapse: collapse !important;
border-radius: 2px !important;
margin-bottom: 10px;
overflow: hidden;
}
</style>
您是否尝试过仅保留上面的内容并删除@media印刷品?
您还正确导入了css文件吗?
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。