简体   繁体   English

当div在@media屏幕中滚动时,如何在@media打印中显示div的内容

[英]How to show contents of div in @media print when div scrolls in @media screen

Currently I have a <div> with overflow-y:scroll set. 目前我有一个带有overflow-y:scroll设置的<div> The issue is the contents won't show during print. 问题是打印期间内容不会显示。

Ideally, I'd like the <div> to expand to show the entire contents but only during print (maybe using @media print ) 理想情况下,我希望<div>扩展以显示整个内容,但仅限于打印期间(可能使用@media print

I imagine this requires javascript but I'm not adept enough to figure it out on my own! 我想这需要javascript,但我不够擅长自己搞清楚!

Thanks for helping 谢谢你的帮助

Set height of your <div> is auto and overflow-y: inherit in @media print : 设置<div>高度为autooverflow-y: inherit@media print overflow-y: inherit

@media print {
  // Reset to default height, overflow-y of div
  .your-div {
    height: auto;
    overflow-y: inherit;
  }
}

Just try to add this style to your @media print 只是尝试将此样式添加到您的@media打印

div {
   overflow-y:show;
   /* Another your style */
}

This will make your content visible, although it exceeded the height limit of your div. 这将使您的内容可见,但它超出了div的高度限制。 Hope this link help you W3School: Overflow 希望这个链接可以帮助你W3School:溢出

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM