2020-07-29 题目来源:http://www.h-camel.com/index.html
[html] 制作页面时,前端如何适应各种异形屏?
沉浸式体验与异形屏适配 https://blog.csdn.net/u012165769/article/details/106843367/
[css] z-index可以是负数吗
z-index 指定一个元素的堆叠顺序,该元素需要设置定位 position: absolute|relative|fixed;
z-index 可以是负数,意义在于置于较高堆叠顺序元素的后面。
[js] 写一个方法监听DOM宽高的变化
监听DOM大小的变化,可以有2个方式:
1. 一般考虑,当窗口发生变化的时候,获取dom的样式
缺点: 通过js去控制的dom宽高变化,但是window没有发生resize,所以不会监听到变化。
window.onresize = function() {
const width = getStyle(dom, 'width');
const height = getStyle(dom, 'height');
}
function getStyle(ele,attr){
if(window.getComputedStyle){
return window.getComputedStyle(ele,null)[attr];
}
return ele.currentStyle[attr];
}
2. 使用 setInterval的方式监听dom的变化
缺点: 实际项目中不可能使用这个。
let timer = 0;
timer = setInterval(() => {
const style = {
width: getStyle(dom, 'width'),
height: getStyle(dom, 'height'),
};
}, 200)
3. 自己开发模块
参考文章 https://blog.csdn.net/mapbar_front/article/details/83190372
该项目的github地址:https://github.com/liwudi/wd-domsize-monitor.git
[软技能] markdown文件如何实现页面内跳转?
点击目录下名称,跳转到目标位置 在目标位置,如网站与域名处,加上id,如 <h2 id="yuMing">网站与域名</h2>
在目录下的相应的名称下,如域名后加上目标位置的id,域名 则点击目录的域名,会跳到目标位置网站与域名。
点击目标位置结尾,回到目录 在目录处,加上id ,如## 目录 在目标位置结尾,加上目录的id,比如回到“主要内容”。 则点击目标位置结尾,就会跳回到目录。