缩小Bootstrap

Question

我正在尝试创建一个使用Bootstrap兼容<div>, <span>等标签的“帖子”创建者。当用户将他们的帖子键入文本框时，我希望在它旁边创建一个“预览”，页面宽度为1/2页。因此，其中的所有内容都将缩小为2。

我的问题：有没有办法缩小Bootstrap元素，以便可以将其制作成预览？我可以使用jquery等来获取输入并将其动态格式化到页面上，但我只需要知道如何实际缩小所有内容。

谢谢！

Answer 1

假设您可以对目标受众进行假设或设置最低浏览器指南，则可以选择使用CSS3 2D Transforms。因此，例如，如果您希望将预览窗口缩放50％，则可以执行以下操作：

#my-preview-div {
transform: scale(.5);
-ms-transform: scale(.5); /* IE 9 */
-webkit-transform: scale(.5); /* Safari and Chrome */
-o-transform: scale(.5); /* Opera */
-moz-transform: scale(.5); /* Firefox */      
}

然后，您可以使用jquery将预览html注入预览div，例如<div id="my-preview-div"></div>。