首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

当用户在运行时选择页面大小时,window.print()以毫米为单位设置窗口高度宽度

当用户在运行时选择页面大小时,window.print()以毫米为单位设置窗口高度宽度。window.print()是JavaScript中的一个方法,用于打印当前页面。在调用该方法时,可以通过设置窗口的高度和宽度来指定打印页面的大小。

具体来说,window.print()方法会弹出打印对话框,用户可以在对话框中选择打印机和打印设置。其中,页面大小是一个重要的打印设置选项。通常情况下,打印机会提供一些标准的页面大小选项,如A4、Letter等。但是,有时候用户可能需要自定义页面大小,这时就可以通过window.print()方法来设置窗口的高度和宽度。

在window.print()方法中,可以使用CSS的@page规则来设置页面的大小。@page规则是CSS中用于定义打印页面样式的一种规则,可以通过设置page属性来指定页面的大小。其中,page属性中的size属性用于设置页面的大小,可以使用毫米、英寸、厘米等单位来指定。

例如,如果要将打印页面的高度设置为100毫米,宽度设置为200毫米,可以使用以下代码:

代码语言:txt
复制
var printWindow = window.open('', '_blank');
printWindow.document.write('<html><head><style>@page { size: 200mm 100mm; }</style></head><body>Hello, World!</body></html>');
printWindow.document.close();
printWindow.print();

在上述代码中,首先使用window.open()方法创建一个新的窗口对象printWindow,然后使用printWindow.document.write()方法向该窗口写入HTML内容。在HTML内容中,使用<style>标签定义了一个@page规则,其中的size属性设置了页面的大小为200mm 100mm。最后,调用printWindow.print()方法打印该窗口的内容。

需要注意的是,不同浏览器对于window.print()方法的实现可能会有所不同,因此在实际使用中可能需要进行兼容性处理。此外,页面大小的设置也可能受到打印机驱动程序的限制,因此在选择页面大小时需要考虑打印机的支持情况。

腾讯云提供了一系列与云计算相关的产品和服务,包括云服务器、云数据库、云存储等。这些产品和服务可以帮助用户快速搭建和管理云计算环境,提供稳定可靠的计算、存储和网络资源。具体可以参考腾讯云官方网站的相关产品介绍:

  • 腾讯云官方网站:https://cloud.tencent.com/

请注意,以上答案仅供参考,具体的技术实现和产品选择应根据实际需求和情况进行评估和决策。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

CSS 尺寸单位概述

零宽单位: ch 和 rch ch 和 rch 单位基于用于渲染的字体中零字形的宽度高度进行度量。文档的内联轴水平轴时,计算基于其宽度。如果内联轴是垂直的,则根据零字形的高度进行计算。...本地行高或 lh 单位继承了祖先元素的行高值。 项目使用多种字体和/或语言时,ex、cap、ic 和 lh 等单位尤其有用。即使用户更改了字体设置,也能保持垂直和大小比例。...视口相对单位 视口相对单位,顾名思义,取决于浏览器窗口的尺寸、iframe 或设备尺寸。它们是相对于初始包含块的大小计算的,如果是分页媒体,则是视口或页面。一个视口百分比单位等于初始包含块的 1%。...这与百分比不同,百分比将尺寸设置父元素宽度高度的一定比例。...方向改变或用户滚动时,它们可能会改变。例如,浏览器界面影响视口大小时高度 100dvmax 的元素就会改变大小。

34310

【知识】Latex中的emptmm等长度单位及使用场景

cm(centimeter):厘米,另一个常用的公制长度单位。in(inch):英寸,1 英寸等于 25.4 毫米。ex:基于当前字体中“x”字母的高度。em:基于当前字体中“M”字母的宽度。...LaTeX中这些单位允许用户多种方式来指定和控制文档的布局和外观。在具体使用时,选择哪种单位通常取决于用户的需求和习惯。...在调整UI组件(如按钮和选择框)大小时非常有用,因为这样可以保持与周围文本的视觉协调。ex:适用于设置基于当前字体的x-height相关的垂直间距,如上下标位置。...当你需要内容与特定字符的视觉高度一致时,使用ex单位非常合适。pc:适用于更传统的排版场景,如书籍和杂志设计中的大块文本设置需要在多个页面上保持严格的布局一致性时使用。...调整字体大小        在定义文档的基本字体大小时,pt是最常用的单位:\documentclass[12pt]{article}        这将设置文档的基本字体大小12点。3.

71410
  • css中的单位

    前端开发中, 做适配是少不了的, 即页面在各种尺寸的机型中显示效果一样, 这就用到了css中的各种长度单位, 做一下总结 在css中, 长度单位分为以下几种 绝对单位: px、in、cm、mm、pt、pc...百分比单位: vw、vh、vmin、vmax、% 相对单位: em、rem、ex、ch 各单位的介绍 px 不用过多介绍, 精确像素 in 寸 cm 厘米 mm 毫米 pt 大约1/72寸 pc 大约...1/6寸 vw 窗口宽度参照, 1vw窗口宽度的1% vh 窗口高度参照, 1vh窗口高度的1% vmin 窗口宽度高度中较小的一个参照,百分比 vmax 窗口宽度高度中较大的一个参照..., 百分比 % 父节点基准的百分比 em 父节点字体大小基准值, 父节点字体大小20px, 则1.5em30px rem 根节点字体大小基准值, 及HTML标签的字体大小 ex 当前字体...x的高度基准, 无法确定时0.5em ch 当前字体0字符基准值, 无法确定时0.5em

    1.5K20

    H5页面适配及微信默认字号问题的最佳实践

    ,并且父元素没有指定高度时,子元素设置百分比没有效果,高度直接子元素的实际高度 vm css3 新单位,相对于视窗宽高较小的那个的百分比,兼容性较差 下面的单位几乎用不到: in 寸 cm 厘米 mm...目前,移动端页面一般使用 rem 或 vw / vh 开发会较为方便,下面 rem 例: 为了方便计算,约定:100px = 1rem,若设计师给到一张宽度 750px 的设计稿,那么可以设置 html...的字体大小 设备宽度 / 设计稿宽度 * 100 个px像素, iPhone 6/7/8 的宽度 375px 例,则 html 字体的大小 50px,即在宽度 375 px 的设备上,1rem...横版页面的 rem 适配 上面第二部分通过动态设置 html 的 font-size 已经实现了页面随设计稿比例缩放,这种方式是页面宽度 100% 撑满设备宽度的,但是很多情况下,我们更希望部分横版页面能够高度撑满设备高度...,而左右部分留白,此时有两种方式可以实现: html 的 font-size 依据页面高度进行设置,假设横版设计稿高度 375px var clientHeight = document.documentElement.clientHeight

    3.4K140

    Android的尺寸单位

    测试关注点 ① 在实际项目中,非文字的一般会使用dp作为尺寸度量单位,如指定两个视图的间距,H5页面中某布局的宽度(eg.layout_width="60dp"); ② 通过adb shell dumpsys...5. sp 介绍 sp是与缩放无关的抽象像素(Scale-independent Pixel),sp和dp很类似但唯一的区别是,Android系统允许用户自定义文字尺寸大小(小、正常、、超大等等),文字尺寸是...“正常”时,1sp=1dp=0.00625英寸;而文字尺寸是“”或“超大”时,1sp>1dp=0.00625英寸。...类似我们在windows里调整字体尺寸以后的效果——窗口大小不变,只有文字大小改变。 指定文本大小时,则会使用可缩放像素 (sp) 作为单位。...其他几个较少比较少用到的尺寸单位,举例如下: mm:即毫米; in:即英寸,1英寸≈2.54厘米; pt:1pt=1/72英寸=0.035厘米。

    1.5K10

    JavaScript BOM学习

    :可选,窗体的特性定义 属性 特性 height 窗口高度 width 窗口宽度 left 左边距 top 左上边距 directories 是否显示链接工具栏 location...() 获得当前对象窗口的焦点 window.blur() 释放当前对象窗口的焦点 window.print() 打印当前窗口或Frame window.scrollBy()/scrollTo() 滚动当前窗口总的...、Opera、Safan window.innerHeight 浏览器窗口的内部高度 window.innerWidth 浏览器窗口的内部宽度 IE8以下版本 document.documentElement.clientHeight...// 页面绝对居中必须设置style属性: position:absolute; var left = (w-width)/2; var top = (h-height)/2; // 利用margin...(true/false选择是否从服务器刷新) location.replace(url) 通过url网址刷新当前网页 历史对象:history 历史对象保存着用户上网的历史记录 属性方法 特性 history.back

    90020

    Flink Session Window 六个灵魂拷问

    会话窗口在一段时间内没有接收到元素时,即发生不活动的间隙时,会话窗口关闭 会话窗口分配器可以设置静态会话间隙和动态会话间隙 ?...二、实际应用问题 每个用户在一个独立的session中平均页面访问时长,session 和 session 的间隔时间是15分钟 我们使用 flink 来解决这个问题 (1)读取 kafka 中的数据...(2)基于用户的 userId,设置 一个 session window 的 gap,在同一个session window 中的数据表示用户活跃的区间 (3)最后使用一个自定义的 window Function...session 的窗口中: .allowedLateness(Time.minutes(60)) (2)假如由于某种原因,数据仍然延迟了1个小时之后,才到来,如何处理,不能总是一直调 allowedLateness...flink 我们提供了 触发器,使得在用户产生访问日志的过程中,周期性的触发窗口计算 如: val outputTag = new OutputTag[User]("late_data"){}val

    3K20

    微信小程序布局单位的使用

    rpx单位是微信小程序中css的尺寸单位,rpx可以根据屏幕宽度进行自适应。官方推荐微信小程序可以用iPhone6 作为视觉稿的标准。规定屏幕宽750rpx。...rpx却是固定的,所以可以使用rpx作为单位,来设置布局的宽高,不是所有的单位都适合rpx,字体不适合rpx,会导致不同设备看不清。...根据设计稿按照1rem = 40px 对着各个元素进行单位转换 px:绝对单位页面按精确像素展示 em:相对单位,基准点父节点字体的大小,如果自身定义了font-size按自身来计算(浏览器默认字体是...vh:viewpoint height,视口高度,1vh等于视窗高度的1%。 vw和vh是css3中的新单位,是一种视窗单位,在小程序中也同样适用。...小程序中,窗口宽度固定为100vw,将窗口宽度平均分成100份,1份是1vw 小程序中,窗口高度固定为100vh ,将窗口高度平均分成100份,1份是1vh [图片.png] vmin:vw和vh中较小的那个

    3.1K61

    折叠屏上应用设计规范,了解一下?

    最重要的一点是,栏式网格提供了一种合理的方式来思考屏幕尺寸变大或变小时如何将内容进行重排,从而帮助您对不同的屏幕尺寸作出一致响应。...例如,几乎所有标准手机在竖屏模式下都采用了较小 (Compact) 宽度和中等 (Medium) 高度的组合,由于普遍使用垂直滚动,对大多数应用而言,根据宽度的尺寸类别进行适配就已足够。...△ 响应式界面可根据屏幕尺寸变化而调整内容布局 设想一下,您调整浏览器窗口小时,如果浏览器回退了一个页面,或者重定向到另一个页面,又或者修改了历史记录,这种体验非常奇怪。...屏幕尺寸变小时,可以删除哪些内容。然后再选择合适的策略。这可能意味着您需要重新审视导航图,尤其是您目前的设计手机为主时更应如此。...我们将使用这些坐标以及宽度高度创建一个 Rect 对象,这样我们便得到了窗口坐标空间中的视图边界。

    4.5K20

    网页布局的几种方式有哪些_做网页建议用哪种布局

    大家好,又见面了,我是你们的朋友全栈君 固定布局   网页设置一个固定的宽度,通常以px做为长度单位,常见于PC端网页。   ...流式布局(Liquid Layout)   网页设置一个相对的宽度页面元素的大小按照屏幕分辨率进行适配调整,但整体布局不变,通常以百分比做为长度单位(通常搭配 min-*、max-* 属性控制尺寸流动范围以免过大或者过小导致元素无法正常显示...缺点:因为宽度使用%百分比定义,但是高度和文字大小等大都是用px来固定,所以在大屏幕下显示效果会变成有些页面元素宽度被拉的很长,但是高度、文字大小还是和原来一样,显示非常不协调 栅格化布局   将网页宽度人为的划分成均等的长度...为了兼容 IE,采用的是浮动方式来实现栅格系统: 即每一个栅格都是用左浮动和百分比来进行排版,窗口宽度改变,对应改变 container 容器的宽度,对应栅格宽度自然也跟着改变: bootstrap4...但弹性布局也有局限性,如果不对这种布局设置一个最小宽度,当用户缩小窗口到足够小时会造成布局严重错位。

    3K20

    Vcl控件详解_c++控件

    GetImageIndex:特定页指定显示的图像 GetPageFromDockClient:可获得客户区上放置的单标签页 GetSiteInfo:确定页面组件的停靠区域并确定拖动的窗口是否可放入...PageRect:在打印时,指定一个像素单位的打印区域 PlainText:设置控件中的文本是否是纯文本方式 SelAttributes:设置该控件中文本的属性 SelLengthL...:真时可整个行高度显示。...只读 ButtonWidth:设置按钮的宽度 Customizable:程序运行时用户是否能自定义工具栏 CustomizeKeyName CustomizevalueName DisabledImages...TCoolBands Bitmap:在TcoolBand区后显示的图像 Constraints:指定组件宽度高度的最大值和最小值,组件重新调整大小时,不能违反这些约束 DockSite:指定组件是否成为拖动停放操作的目标

    4.9K10

    移动端web开发入门笔记

    浏览器的这一性质会带来一些影响,比如我们的导航条的宽度设置成100%,那么页面放大的时候,就会出现下面的状态: ?...可以看到,缩放比例100%时,layout viewport = visual viewport,当用户页面放大时,显示在屏幕上的页面部分变化了,所以visual viewport变化了,而layout...在上面那条标签中,顾名思义width=device-width是将layout viewport的宽度设置屏幕的宽度,但这里有些隐情就是比如使用device-width时,Nexus One的正规宽度是...浏览器窗口小时,内容会被剪掉,实际上由于viewport的原因,这种固定大小的页面在移动端的展示也是很不友好的。...%(流式布局) 流式布局实际上就是百分比宽度 + 固定高度,当前国内百度的移动端页面就是这么做的。浏览器宽度缩小,容器也跟着缩小,设备屏幕较小时,体验也会好一点。

    1.1K10

    移动端web开发入门笔记

    浏览器的这一性质会带来一些影响,比如我们的导航条的宽度设置成100%,那么页面放大的时候,就会出现下面的状态: ?...可以看到,缩放比例100%时,layout viewport = visual viewport,当用户页面放大时,显示在屏幕上的页面部分变化了,所以visual viewport变化了,而layout...在上面那条标签中,顾名思义width=device-width是将layout viewport的宽度设置屏幕的宽度,但这里有些隐情就是比如使用device-width时,Nexus One的正规宽度是...浏览器窗口小时,内容会被剪掉,实际上由于viewport的原因,这种固定大小的页面在移动端的展示也是很不友好的。...%(流式布局) 流式布局实际上就是百分比宽度 + 固定高度,当前国内百度的移动端页面就是这么做的。浏览器宽度缩小,容器也跟着缩小,设备屏幕较小时,体验也会好一点。

    1.8K90

    css 文字自适应大小_div自适应窗口大小

    class="box"> DEMO地址:http://qianduannotes.sinaapp.com/test/paintBug.html box的宽度设置...900px,wrap设置100%(~~这个百分比是相对于viewport的);缩小浏览器窗口宽度小于900时会出现滚动条,向右滚动,会发现蓝色部分并不是100%,这个问题大家可以去思考下。...px,em,rem,vh,vw,vmin,vmax的区别及浏览器支持情况 px:绝对单位页面按精确像素展示 em:相对单位,基准点父节点字体的大小,如果自身定义了font-size按自身来计算(浏览器默认字体是...(另外需注意chrome强制最小字体12号,即使设置成 10px 最终都会显示成 12px,把html的font-size设置成10px,子节点rem的计算还是以12px基准,所以网上很多文章提到的将...: %:百分比 in:寸 cm:厘米 mm:毫米 pt:point,大约1/72寸 pc:pica,大约6pt,1/6寸 ex:取当前作用效果的字体的x的高度,在无法确定x高度的情况下0.5em计算

    3.3K20

    vivo悟空活动中台-基于行为预设的动态布局方案

    仅仅是体力劳动已经完全不能解决问题,我们需要有更高效的办法——制定一套规则,遵循该规则的页面能够在运行时自己去适配所在设备。...2、普适性方案 为了实现页面行时的样式自适应,我们从一开始的静态布局、流式布局、到响应式布局、弹性布局,目前大家普遍采取的方案是使用rem单位的弹性布局,即基于设备像素比( Device Pixel...1、背景图尺寸预设 1.1、多种方案灵活可选 提供多种背景图填充方式,供用户灵活选择: 默认——不对 background-size 进行设置 拉伸填充——横纵平铺 包含—— contain 覆盖——...元素若预设吸附了视口某一条边,则在任意规格的视口中,元素锚点相对于该条边的距离相同( rem 单位)。...1、基准视口与实际视口 1.1、基准视口宽高 描述基准视口的宽度高度,我们设基准宽度用 baseW 表示,其值 10.8 rem (对应设计稿 1080px ),同理基准高度 baseH 的值设置

    2.1K10

    论CSS中可使用的font-size的长度单位

    使用像素设置文字元素的font-size既难维护,又对用户不那么友好。如果你总重新设计一个非常的网站,改变所有元素的文字大小可能变成一个梦魇。...Em 使用em作为长度单位可以帮你避免任何被用户设置覆盖产生的问题。设置 font-size1em的元素实际高度依赖与浏览器设置。除非用户或者你在其他地方设置,其默认大小是16px。...它们常用在自适应网站设计中与根据不同的页面宽度断点设置不同的字体大小。...如果使用得当,它们还可以避免通过不同断点设置字体大小的实现代码。这是因为这些单位值会随着视窗的高度宽度做连续性的变化。...这些值分别使用0.0123或者0.1666英寸单位。类似的,你还可以使用英寸(in),厘米(cm)和毫米(mm)来设置页面的打印边距。

    2.4K20

    第131天:移动web页面的排版与布局

    一、总之一句话, 尽量用mm 毫米作为标准单位. 采用新的相对单位 rem 首先设置html的 font-size 根大小. ...自从有了手机以后, html的单位又变得混乱了起来. 自适应变的非常困难.  我们公司 . 美工设计的宽度标准是750px  所有的手机移动页面全部按照 750px 设计出图. ...一般的百分比都是给宽度设置百分比. 高度 自动.或者定高.一个固定的数值.如果 高度也可以百分比话.就太好 了. 可惜div 默认是没有高度的. ...:9mm; /*屏幕等于设计的 9/10, 标准尺寸也缩小到9/10 最好的写法是单位 mm 毫米 */ 12 } 13 } 14 @media screen and (max-width:...*/ 2 { 3 html{ 4 font-size:10mm; /*满屏按照10px来算,最好的写法是单位 mm 毫米*/ 5 } 6 } 7 @media

    1.7K10

    浏览器分页静默打印

    最简单的做法就是直接打印整个网页,在浏览器直接打印或者调用window.print()。 这样就能将当前页面整个打印出来了。...这里介绍两个最简单的方法: 方法一:直接调用window.print()。 调用之前将不需要被打印的元素先通过display: none隐藏掉,打印执行完毕再将其显示display: block。...但是作为 html 页面,没有对应的 css 样式是行不通的。 所以,我们还需要用 css 来做一些布局来保证 pageList 里面的一个 item 的总高度 A4 的高度。...因此,此文件通过设置各个 body 容器和 page 容器的高度将每一页设置固定高度,这样我们打印出来的内容就是我们最终期望的分页数据了。.../* css全部使用mm作为单位 */ .a4-body { width: 208mm; /** 这里的宽度就是A4纸的宽度 */ margin: 0 auto; text-align: center

    63410

    Android屏幕适配AndroidAutoSize的使用「建议收藏」

    App 的窗口小时 //系统会重绘当前的页面, 经测试在某些机型, 某些情况下系统不会主动重绘当前页面, 所以这时您需要自行重绘当前页面 //ScreenUtils.getScreenSize...false, 在屏幕高度基准进行适配时 //AutoSize 会将屏幕总高度减去状态栏高度来做适配 //设置 true 则使用设备的实际屏幕高度, 不会减去状态栏高度 /.../是否全局按照宽度进行等比例适配, 默认为 true, 如果设置 false, AutoSize 会全局按照高度进行适配 isBaseOnWidth = true //设置屏幕适配逻辑策略类...下面我们看下高度适配基准 AndroidAutoSize默认是以宽度基准适配的 你可以选择初始化配置的时候全局配置宽度或者高度适配 AutoSizeConfig.getInstance().apply...//是否全局按照宽度进行等比例适配, 默认为 true, 如果设置 false, AutoSize 会全局按照高度进行适配 isBaseOnWidth = false

    3.2K20

    LaTeX中排版时的宽度问题

    涉及到页面宽度,有这么几个: \linewidth - 当前行的宽度 \columnwidth - 当前分栏的宽度 \textwidth - 整个页面版芯的宽度 \paperwidth - 整个页面纸张的宽度...\hsize - Plain TeX 的宏,是 TeX 在行末考虑分词换行时使用的宽度 这些宽度里,\hsize 是 Plain TeX 的宏,不推荐 LaTeX 用户使用,简单地当它不存在就好了。...总的来说,* 需要在列表环境中使用表格、图片等宽度的时候,用 \linewidth 需要充满整个页面宽度的时候,用 \textwidth (比如 figure/table 等) 需要充满整个分栏的时候...,用 \columnwidth (比如 figure/table/tabularx/tabu 等) 单位 单位 名称 说明 mm 毫米 1 mm = 2.845 pt pt 点 1 pt = 0.351...pt cc 西塞罗 1 cc= 4.513 mm= 12 dd = 12.84 pt in 英寸 1 in = 25.4 mm = 72.27 pt ex ex 1 ex = 当前字体尺寸中 x 的高度

    3.4K20
    领券