css去也没页眉页脚

在网页设计中,页眉和页脚是很重要的部分,它们可以让网站看起来更整洁和专业。但有时候我们也会遇到一些情况,需要去掉网页的页眉或页脚,比如制作单独的页面或者需要打印的页面。下面就来介绍如何使用CSS去除网页的页眉或页脚。

  
    //去掉页眉
    @media print {
      @page { margin-top: 0; }
      body { margin-top: 2cm; }
    }

    //去掉页脚
    @media print {
      @page { margin-bottom: 0; }
      body { margin-bottom: 2cm; }
    }
    
    //同时去掉页眉和页脚
    @media print {
      @page { margin: 0; }
      body { margin: 2cm; }
    }
  

css去也没页眉页脚

上面的代码使用@media print来指定打印样式,可以使网页在打印时去掉页眉和页脚。其中@page用来设置页面的打印属性,margin-top表示页眉的高度,margin-bottom表示页脚的高度,通过将它们设置为0可以把页眉或页脚去掉。而body的margin属性则用来调整打印内容与纸张的距离。

如果需要同时去掉页眉和页脚,可以将@page中的margin属性设置为0,同时将body的margin属性设置为需要的值。这样即使在分页时也能保证网页的整洁。

相关文章

Css3如何实现鼠标移上变长特效?(图文+视频)
css3怎么实现鼠标悬停图片时缓慢变大效果?(图文+视频)
jquery如何实现点击网页回到顶部效果?(图文+视频)
css3边框阴影效果怎么做?(图文+视频)
css怎么实现圆角边框和圆形效果?(图文+视频教程)
Css3如何实现旋转移动动画特效