如果有内联样式，我如何缩小div？

Question

从HTML编辑器中，用户可以编写问候语文本，例如，源代码将是：

<p style="text-align:center">
  <span style="font-size:20px">
    <span style="font-family:tahoma,geneva,sans-serif">Hej,</span>
  </span>
</p><br><br>
<p style="text-align:center"><span style="font-size:20px">
  <span style="font-family:tahoma,geneva,sans-serif">
    <span style="color:#FF0000"><em>Du&nbsp;</em></span>
    <strong>kan skrive</strong>&nbsp;
    <span style="color:#0000CD"><u>din hilsen</u></span> her!</span>
  </span>
</p>

女巫翻译

当他们点击那个绿色的“保存”按钮时，我会显示一个简单的预览，例如

我的问题是，预览并不适用于将要打印的内容，我无法使用任何CSS来修剪该文本周围的<div>样式，以便更好地展示它...

我想缩小25％...无论如何我能做到吗？

Answer 1

CSS3

#class:target{     -webkit-transform: scale(0.25);
-moz-transform: scale(0.25);
-o-transform: scale(0.25);
-ms-transform:scale(0.25);
transform:scale(0.25); }

http://jsfiddle.net/s26cm/

Answer 2

提示：如果要根据相对元素对字体大小进行缩放，则可以使用px代替%，如果需要相应缩放，则可以使用em整个页面的字体大小，同时缩小div，相应缩小字体

12pt = 16px = 1em = 100%这可能会更改字体大小单位

将id或class分配给该div并使用脚本中的选择器在单击 save 按钮后更改大小，它将覆盖内联样式，先生可以发一个小提琴吗？

Answer 3

“如果div具有内联样式，我怎么能缩小它？”

你的意思是：

display: inline;

如果您这样做 - 设置为内联显示的任何内容都不会接受宽度属性。 切换到内联块;