用 CSS 实现打印显示底色
上一篇有讲到如何在浏览器端实现打印功能。后面发现有个问题,就是表格表头有背景颜色,但是实际打印出来无背景颜色。网上的方法主要有以下几种实现方式:
1.把背景颜色写成行内样式,如下图所示:

但是发现这样子写了,并不行。可能还需要设置其他的,如果有知道的亲,望不吝赐教~
2.在打印的时候用户自己设置,如下图:

该方法虽然奏效,但是出于用户体验的角度考虑,不太现实。
3.直接用CSS 控制,此法有效,简单~直接上代码:
@media print {
.receipt-print .table th {
background-color: #f1f4f7 !important;
-webkit-print-color-adjust: exact;
}
}
@media print 是针对于打印媒体的。
-webkit-print-color-adjust属性不是个标准属性,具体的含义,使用方法可访问https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-print-color-adjust。
用 CSS 实现打印显示底色的更多相关文章
- css控制打印时只显示指定区域
CreateTime--2017年9月26日08:16:04 Author:Marydon css控制打印时只显示指定区域 思路: 1.使用打印命令@media print: 2.控制执行打印命令 ...
- 用CSS创建打印页面
用CSS创建打印页面,不必为打印而专门建立一个HTML文件,可以节省一些体力,其前提是按“WEB标准”用CSS+DIV布局HTML页面. 第一.在HTML页面加入为打印机设置的CSS文件 <li ...
- css多行显示省略号
首先说css多行显示省略号和单行文本省略号: 我们知道,单行显示省略号时,我们首先需要设置容器的宽度width:value(具体的值),然后强制文本在一行内显示,即white-spacing:nowr ...
- CSS实时编辑显示
方法 CSS实时编辑显示:通过display:block让css文本显示出来,再加上contentEditable使文本可编辑 <!DOCTYPE html> <html> & ...
- css 超出部分显示省略号
代码: overflow: hidden; white-space: nowrap; text-overflow: ellipsis; 重点代码:text-overflow: ellipsis; 解 ...
- FE: CSS固定图片显示大小及GitHub Pages在线演示
CSS固定图片显示大小 分析 假设图片区域的大小固定为250×300px,那么我们可以写出如下的样式 .picture-area { width: 250px; height: 300px; marg ...
- css 图片 圆形显示区域
css 图片 圆形显示区域 css 和 div 实现 方形图片 圆形显示 点击下载
- css控制div显示/隐藏方法及2种方法比较原码 - czf164的专栏 - 博客频道 - CSDN.NET
body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...
- C语言 二维数组复制、清零及打印显示
#include <stdlib.h> #include <stdio.h> #include <string.h> //二维整型数组打印显示 ],int row, ...
随机推荐
- 自定义Microsoft Visual Studio 代码模板,增加公司和个人信息
C:\Program Files (x86)\Microsoft Visual Studio 12.0\Common7\IDE\ItemTemplates\CSharp目录里面有各种新建模板分类: 修 ...
- CentOS 安装 Hadoop
原文地址:http://www.cnblogs.com/caca/p/centos_hadoop_install.html 下载和安装 download hadoop from http://ha ...
- 实现 Sunday 算法
鉴于校园招聘笔试题,有个字符串模式匹配的问题,99+%都是暴力,偶尔一两个写KMP,但是明显是知其表不知其里.期待的 BM算法 或者 Sunday 没有出现!鉴于网友的回复,特此声明:我的代码假定字符 ...
- 统一日志监控系统 springboot websocket 简单版 王代军-作品
http://git.oschina.net/redArmy/springboot-websocket-logs 目的: 统一监控 开发测试环境日志 如果需要可以拓展线上环境的日志(自己视情况而定) ...
- ansible 一些参数的整理
用ansible 来管理远程的主机,最大的好处是方便,ansible不用在远程的主机上安装ansible的客户端,ansible只要能通过ssh连接上远程主机就 能对它进行管理.也就是说ansible ...
- Spring自带配置方式链接数据库(没有src新建文件,没有c3p0)
1.配置文件 <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http:/ ...
- 编写自己的jquery插件
如何编写自己的jquery插件 Jquery的插件主要分为三类: .封装对象方法的插件:大部分插件都是封装对象的插件 .封装全局函数的插件:将独立的函数添加到jquery的命名空间之下.Jquery. ...
- Memcached安装使用和源代码调试
memcached官网:http://memcached.org/ 一.安装 下载 # wget http://www.memcached.org/files/memcached-1.4.25.tar ...
- js中push和join方法使用介绍
push和join方法想必大家并不陌生吧,在本文将为大家详细介绍下js中的push和join方法的使用.代码: <script type="text/javascript"& ...
- ny55 懒省事的小明
懒省事的小明 时间限制:3000 ms | 内存限制:65535 KB 难度:3 描述 小明很想吃果子,正好果园果子熟了.在果园里,小明已经将所有的果子打了下来,而 ...