2020-09-18 html的打印网页换页 + css的height100%如何生效 + JS的暂存死区 + 软技能的屏幕坐标、客户区域坐标、页面坐标
2020-09-18 题目来源：http://www.h-camel.com/index.html
[html] 打印网页时，如何让指定的元素另起一页打印呢
// footer 元素后始终插入分页符
@media print {
footer {page-break-after: always;}
}
// h1 标题之前 始终插入分页符
@media print {
h1 {page-break-before: always;}
}
// 避免在pre blockquote 中使用分页
@media print {
pre, blockquote {page-break-inside: avoid;}
}
[css] CSS如何让height: 100% 生效呢
为什么width会横向铺满，而height却不起作用呢？
浏览器在 计算有效宽度时会考虑到浏览器窗口的打开宽度，若不设定固定宽度值，那么默认将会横向平铺
浏览器根本不会计算内容的高度，所以，除非内容超出浏览器的高度才会出现滚动条，否则浏览器会自动向下堆叠内容
如何使它起到作用呢？ 获取父元素的高度从而来估计自己的高度
<html style="height: 100%;">
<body style="height: 100%;">
<div style="height: 100%;">
<p>
这样这个div的高度就会100%了
</p>
</div>
</body>
</html>
在使用height: 100%;时需要注意的一些事项
1、Margins 和 padding 会让你的页面出现滚动条，也许这是你不希望的。
2、如果你的元素实际高度大于你设定的百分比高度，那元素的高度会自动扩展。
总结自 https://blog.csdn.net/u014520745/article/details/52574179
[js] js的暂性死区的概念理解
由ES6新增关键字 const let 所定义的变量与由 var 关键字定义的具有初始值undefined的变量不同，let const 所生成的使块级作用域，声明的变量直到定义被执行时才会被初始化，在变量初始化访问前进行访问的话就会造成ReferenceError，该变量就会处于自块级顶部到初始化处理的暂存死区中。
也就是说let const 所声明的变量不会做变量提升。
[软技能] 屏幕坐标 客户区域坐标(可视窗口坐标) 页面坐标
1.屏幕坐标 电脑屏幕上任意一点的坐标值 对应的属性分别为screenX，screenY
var div = document.getElementById("myDiv");
EventUtil.addHandler(div, "click", function(event){
event = EventUtil.getEvent(event);
alert("Screen coordinates: " + event.screenX + "," + event.screenY);
});
2.客户区域坐标 浏览器包括 上部的操作菜单栏 下部的可视窗口区域 对应的属性为clientX,clientY
var div = document.getElementById("myDiv");
EventUtil.addHandler(div, "click", function(event){
event = EventUtil.getEvent(event);
alert("Client coordinates: " + event.clientX + "," + event.clientY);
});
3.页面坐标 表示鼠标位于窗口中的位置，而页面坐标通过事件对象的 pageX 和 pageY 属性，能告诉你事件是在页面中的什么位置发生的
var div = document.getElementById("myDiv");
EventUtil.addHandler(div, "click", function(event){
event = EventUtil.getEvent(event);
alert("Page coordinates: " + event.pageX + "," + event.pageY);
});
摘自 https://blog.csdn.net/weixin_34262482/article/details/88613845
上一篇： 命令行 java -jar 执行jar包