vue使用jquery.PrintArea打印样式丢了

使用jquery.PrintArea.js打印网页的样式问题

在使用jquery.PrintArea.js打印局部网页样式的时候,发现样式打印不出来,在网上找了好多资料,整理一下分享给大家一.先看看css的引用文件方式 1.直接在内部的元素中使用”style”属性来定义样式,比如:<div style=”width:800px;”></div> 2.在<head>元素中使用”style”元素来指定 3.使用<link>元素链接到外部的样式文件,比如:<link rel=”stylesheet” type=”te

PrintArea打印，@media screen解决移动web开发的多分辨率问题，@media print设置打印的样式

PrintArea打印,局部DIV打印插件,依赖JQuery. github:https://github.com/RitsC/PrintArea 当打印时需要临时改变页面布局,可以使用 @media print{ /* * CSS */ } 打印时生效,打印完自动失效. 需要屏幕自适应,或多种分辨率可以使用 @media screen and 一.判断媒体类型,引用不同的样式表 <link rel=”stylesheet” media=”screen and (判断条件)” herf=”需要调

Jquery 插件PrintArea 打印指定的网页区域

Jquery 插件PrintArea 打印指定的网页区域需要下载jquery 和printarea.js插件 PrintArea.Js插件,可以打印整个网页中某个指定的区域. $("打印区域").printArea(); $("打印区域") 这个只会打印该区域内的内容(innerHTML),不会打印整个区域outHtml

vue-axios插件、django-cors插件、及vue如何使用第三方前端样式库：element/jQuery/bootstrap

目录一.vue的ajax插件:axios 1.安装axios 2.axios参数二.CORS跨域问题(同源策略) 1.Django解决CORS跨域问题方法三.前端请求携带参数及Django后台如何获取 1.拼接参数方式携带参数和获取 2.数据包方式携带的参数和获取四.Vue配置ElementUI 五.Vue配置jQuery和bootstrap 1.配置jQuery环境 2.配置BootStrap环境补充小知识点一.vue的ajax插件:axios 1.安装axios // 1)安装插

jquery 利用CSS 控制打印样式

一.添加打印样式 1. 为屏幕显示和打印分别准备一个css文件,如下所示: 用于屏幕显示的css: <link rel="stylesheet" href="css/mainstylesheet.css" media="screen" /> 用于打印的css:<link rel="stylesheet" href="css/printstylesheet.css" media=&quo

JQuery巧妙利用CSS操作打印样式

一.添加打印样式 1. 为屏幕显示和打印分别准备一个css文件,如下所示: 用于屏幕显示的css: <link rel="stylesheet" href="css/mainstylesheet.css" media="screen" /> 用于打印的css:<link rel="stylesheet" href="css/printstylesheet.css" media=&quo

css设置网页打印样式

有三种方法 1. 为屏幕显示和打印分别准备一个css文件,如下所示: 用于屏幕显示的css: <link rel="stylesheet" href="css/noprint.css" media="screen" /> 用于打印的css:<link rel="stylesheet" href="css/print.css" media="print" />

Jquery局部打印插件

局部打印插件 jquery.PrintArea.js js代码 (function ($) { var printAreaCount = 0; $.fn.printArea = function () { var ele = $(this); var idPrefix = "printArea_"; removePrintArea(idPrefix + printAreaCount); printAreaC

vue和jQuery嵌套实现异步ajax通信

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible&qu

jquery 浏览器打印

<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <script src="Scripts/jquery-1

jquery局部打印插件使用

基于jquery库的jquery.PrintArea.js插件源代码为: (function ($) { var printAreaCount = 0; $.fn.printArea = function () { var ele = $(this); var idPrefix = "printArea_"; removePrintArea(idPrefix + printAreaCount); printAreaCount++; var iframeId = idPrefix + p

运用jquery做打印和导出操作

我最近接手的项目中经常让做出打印和导出统计图和表格首先说打印,打印如果用echarts做出来的图表,打印的时候,要借助jquery的打印插件. 打印插件: <script src="../Plugin/jquery-print/jquery.jqprint-0.3.js"></script> 然后进行打印操作 <div id="printPopup" class="modal-block mfp-hide">

vue常用插件之打印功能、二维码插件、批量打印二维码

vue实现打印的两种方法 vue实现批量打印二维码 (需安装二维码插件qrcodejs2) 一.vue-print-nb插件 1.安装: npm i vue-print-nb -S 2.全局注册(main.js): import Print from 'vue-print-nb' Vue.use(Print) 3.使用: <div id="printTest" > <p>锄禾日当午</p> <p>汗滴禾下土 </p> <

html / css打印样式

最近做公司后台系统,需要打印贴箱标签,按照正常打印A4纸的标准,测试的效果不是自己想要的,文字排版布局都乱了,查了一些资料,需要设置的东西我总结了一下: 显示器(screen)和打印机(printer)是两种差别很大的设备,所以要设置html/css打印样式. screen一般使用逻辑单位比如px,而打印机则应该使用物理单位比如cm(厘米)或in(英寸).因此如果要精确的控制打印效果就应该使用print css,这是跨平台兼容的标准.不推荐使用浏览器插件方式实现打印. 首先引用print css

jQuery自定义滚动条样式插件mCustomScrollbar

如果你构建一个很有特色和创意的网页,那么肯定希望定义网页中的滚动条样式,这方面的 jQuery 插件比较不错的,有两个:jScrollPane 和 mCustomScrollbar. 关于 jScrollPane,大家见过的可能比较多,但是这个插件太过于古老而且功能不强大,效果在几年前非常不错,但是放在现在就不好说了.所以我选择了后者:mCustomScrollbar.下图是两者官方示例的简单对比: 本文就是介绍如何使用 mCustomScrollbar 这个插件,大部分的内容是翻译自 mCus

web的各种前端打印方法之CSS控制网页打印样式

来源:http://www.jb51.net/web/70358.html CSS控制网页打印样式: 使用CSS控制打印样式,握刚刚使用时一塌糊涂,根本不知道CSS中的midia的作用是什么,问到别人说导入这个样式,还傻乎乎的不知所措.如果你也有这种现象,那么我告诉你吧,在W3school查到CSS的midia的作用. midia 定义和用法: media 属性规定被链接文档将显示在什么设备上. media 属性用于为不同的媒介类型规定不同的样式. 原来用到media来指定css的媒体类型,它的

CSS控制print打印样式

来源:http://blog.csdn.net/pangni/article/details/6224533 一.添加打印样式 1. 为屏幕显示和打印分别准备一个css文件,如下所示: 用于屏幕显示的css: <link rel="stylesheet" href="css/mainstylesheet.css" media="screen" /> 用于打印的css:<link rel="stylesheet&

bootstrap-响应式工具和打印样式

响应式工具: <div class="container">  <div class="row"> <div class="col-lg-4 visible-lg-block">1</div> <div class="col-lg-4 visible-lg

[Q]如何将图纸打印为黑白的及设置打印样式

若只是想打印黑白图形,则在“打印样式列表”选择“monchrome.ctb”打印样式即可. 设置其它打印样式:在CAD批量打图精灵主界面下点设置打印样式图标,如下图: 在打开的资源管理器中选择您想要更改的打印样式,双击将"打印样式"列表框下的颜色全部选,将"特性"栏下的"颜色"设置为黑色,如还需更改线宽,还可设置全部线宽宽度,如图所示这里选择将所有颜色的实体对应为黑色,线宽为0.18毫米,当然你也可以单独设置

jQuery操作css样式

jQuery操作css样式 css操作的分类: css操作位置操作尺寸操作 css操作之css css代码: html代码: jQuery代码: 效果如下: css操作之位置操作 css代码: html代码 jQuery代码效果如下: css操作之尺寸操作 css代码 html代码 jQuery代码效果如下各位大神,如果觉得小弟这篇文章写的不错的话记得在下面给个好评哦!

vue使用jquery.PrintArea打印样式丢了

热门专题