保存网页为PDF时隐藏标题栏

 最近在保存一些网页时发现保存下来的网页有一部分会被标题栏遮住,具体操作为右键打印选项选择另存为PDF,类似下图这种:

image.png
pdf文件

 虽然在向下滑动时标题栏是不可见的,其实它并未被隐藏掉,而是在下一页的开头,所以在屏幕中不可见并不代表打印出来也没有。
 这时候就要发挥我们全栈工程师的能力,用Chrome浏览器打开这个网页,按F12进入开发者选项。

  1. 点击右侧选择页面元素的按钮
  2. 选中整个标题栏
image.png

此时右侧如图

找到对应class
  1. 找到对应的class,点击修改,添加一个visibility属性,即设置该元素可见性为不可见。这时在保存为PDF时就可以看到标题栏已经不见了,同理,下面一栏也可以用同样的方式隐藏。
修改样式

你可能感兴趣的:(保存网页为PDF时隐藏标题栏)