javascript - 媒体打印图像宽度和高度不反射(reflect)

Question

当要打印部分网页时，我有这段代码可以将图像正确定位到页面预览

<style media="print">

  #cropped_image{
     padding-top: 70px;
      padding-left: 6px;
      display: block;
    margin-left: auto;
    margin-right: auto;
    height: 200%;
    width: 200%;

 }
</style>

但是 width 和 height 属性似乎没有反射(reflect)在预览中？有什么转机吗？

Answer 1

如果我错了，请澄清我的代码是这样的: 1.) 或 2.)

.container{
    width:100%;
    border:1px solid #222;
    position:relative;
    height:100%;
}
body,html{
    height:100%;
    width:100%;
}

 #cropped_image{
     padding-top: 70px;
      padding-left: 6px;
      display: block;
    margin-left: auto;
    margin-right: auto;
    height: 20%;
    width: 20%;

 }
 @media print{
    #cropped_image{
     padding-top: 70px;
      padding-left: 6px;
      display: block;
    margin-left: auto;
    margin-right: auto;
    height: 70%;
    width: 70%;
    border:1px solid red

 }

<div class="container">

<img src="red.png" id="cropped_image"/>
</div>