html - 一起使用 "transform"和 "table"

Question

我尝试缩小 Iframe 以在小框架中显示整个页面!

iframe {
width: 1108px;
height: 710px;
-webkit-transform:scale(0.25);
-moz-transform:scale(0.25);
-o-transform:scale(0.25);
transform:scale(0.25);
}

 <table border =1>
<tr>
<td>
<iframe src ="http://example.com"/>
</td>
</tr> 
   </table>

此代码有效，但我在表中遇到问题!当我将 iframe 放在表格中时，单元格大小变为实际 iframe 大小 (1108*710)，但由于代码，iframe 显示很小!我怎样才能使 i 框架适合单元格？

Answer 1

我看到的唯一方法是使用 em 技巧来达到您想要的效果:

iframe {
  width: 69.250em;   /* 1108px = 69.250em */
  height: 44.375em;  /* 710px = 44.375em */
  font-size: 0.25em; /* base scale: 0.25 */
}

<table border=1>
  <tr>
    <td>
      <iframe src="http://example.com"/>
    </td>
  </tr> 
</table>

但是您的 iframe 内容将呈现为您使用 277px * 177.5px 分辨率。