css - 缩小页面及其内容

Question

我有一个名为 wrapper 的 div，带有这个 CSS:

   .wrapper {
            width: 960px;
            min-height: 720px;
            margin: 0 auto;
            text-align: center;
            background: url(images/bg-light.png) no-repeat;
            padding-top: 20px;
            }

位于体内。主体的 CSS:

   body { 
        background: #232323 url(images/bg.png) repeat;
        margin: 0;
        padding: 0;
        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
        }

有以 block 级显示的 HTML 5 元素。这是他们的 CSS:

header, nav, article, section, aside, footer, address {  
        display: block;  
        } 

我正在尝试缩小整个页面。我的意思是，如果您在浏览器中单击 Ctrl/-。那么减小页面大小的最佳方法是什么？如何将其显示为现在大小的 67%(例如)。

Answer 1

如果它只是为了模态或其他东西的效果，那是我能想到你为什么要这样做的唯一原因。

可以使用非跨浏览器

body{
    -webkit-transform: scale(0.67);
       -moz-transform: scale(0.67);
            transform: scale(0.67);
}

Documentation