页面(Page) 字体(Font) 文字布局(Text Style) 图象(Image) 表单(Form)
表格(Table) 表格进阶(Advanced) 多窗口页面(Frames)
会移动的文字(Marquee) 多媒体页面(Alternative Inline Elements)
语言字符集信息
背景色彩和文字色彩
客户端字体
文字的对齐
文字的分区
定制列表元素
预格式化文本
和文字的对齐
在页面中的对齐/布局
客户端图象映射图
文字和密码
复选和单选
隐藏表单的元素
跨多行、多列的表元
文字的对齐/布局
在页面中的对齐/布局
分组
显示
多窗口页面
如果 Vue 项目使用了 Element UI 组件库中的 Table 组件打印表格时不
显示
表格
边框
线，可以通过在 CSS 中覆盖样式来解决。
可以在项目中新建一个 CSS 文件，如 `print.css`，在该文件中添加如下样式：
/* 表格
边框
*/
table {
border-collapse: collapse;
border: 1px solid black;
/* 表格
内容
边框
*/
td, th {
border: 1px solid black;
然后在你打印表格的页面的 head 标签内加入
<link rel="stylesheet" type="text/css" href="print.css" media="print">
如果你使用vue-cli那么也可以在vue.config.
js
的配置里面加入
chainWebpack: config => {
config.plugin("
html
").tap(args => {
args[0].meta.push({name: 'link', content: 'print.css', media: 'print'});
return args;
这样打印出来的表格就会
显示
出
边框
了。
