如何在使用ng-print inAngular JS时应用css样式
如何在使用ng-print inAngular JS时应用css样式
提问于 2016-08-12 07:35:17
我已经使用angular JS创建了PHP页面。现在，我想把这一页打印出来。我已经在我的app.js中添加了ngPrint，并将id分配给了main div。页面预览数据显示完美，但没有css属性。我还添加了ngPrint.css和ngPrint.js。
我在标题部分的代码:-
<link rel="stylesheet" type="text/css" href="css/style.css">
<script src="js/angular.min.js"></script>
<script src="app/app.js"></script>
<!-- ng-print -->
<link rel="stylesheet" type="text/css" href="css/ngPrint.css">
<script src="js/ngPrint.js"></script>
<!--/ ng-print --> 在app.js上：
var mainApp = angular.module("IncomeBenefit", ['ngPrint']);在显示页面上：
<div class="main" id="printSectionId" ng-app="IncomeBenefit">
<h1 class="main_h1_calc">Calculator</h1>
<div class="col-main-w-12" ng-controller="displayController">
<div class="col-main-w-5">
<div class="form-header-main" ng-repeat="X in names">
<!-- form section -->
<div class="form-header">
<div class="form-header-l">Client Age</div>
<div class="form-header-r">{{X.client_age}}</div>
</div>
<!--/ form section -->
</div>
</div>
<button class="btn btn-primary" ng-print print-element-id="printSectionId"><i class="fa fa-print"></i> Print</button>
</div>
</div>我一点也不知道。如何向我的可打印数据添加css属性。我也尝试过内联css，但不能成功。我能做些什么？
回答 1
Stack Overflow用户
回答已采纳
发布于 2016-08-12 08:16:31
在您的style.css文件中，尝试添加以下内容，看看会发生什么：
@media print {
body { border: 15px solid black; }
}您必须使用@media print来应用打印样式，并在其中包含所有内容，但请记住，打印时对css的支持是有限的。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/38912425
复制相关文章
相似问题
如何在JS添加css类时应用css代码样式
如何在使用ID时应用CSS样式？
如何在使用JS单击按钮时更改CSS样式
如何在打印时应用CSS样式？
CSS样式提交，如href标记
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
