如何将网页宽度以像素为单位缩放到任何屏幕尺寸？

问题描述

| 我正在尝试创建固定宽度（970 px）的网站，并希望确保将其调整为任何潜在的用户屏幕尺寸，但是浏览器会继续显示该屏幕，但不会显示我的整体屏幕宽度。     

解决方法

        如果您要使页面跨度为宽度的100％，请查看以下文章： 液体布局 如果您尝试将固定宽度的内容放在任何页面宽度上，请使用：

margin: 0px auto;

    ,        您所追求的并不是液体布局，而是一种“弹性”布局，并附加了一个“自动拉伸”脚本。 有一些步骤可以使它起作用： 使用ems作为尺寸（而不是像素尺寸）来创建布局。这样可以使布局“可缩放”，同时保持其比例正确。 将缩放值以百分比形式应用于您的ѭ1as元素。此默认设置很有用，因为它在几乎所有浏览器中都将1em设置为等于10px：

body {font-size:62.5%;}

这意味着您的布局的宽度为

97em

。 使用javascript来检测用户页面的宽度，并调整主体上的缩放值以更改\'zoom \'以适合页面。您可能希望它在页面加载时至少运行一次，并且可能在浏览器调整大小时至少运行一次。 这是弹性布局的一个很好的起点：http://www.alistapart.com/articles/elastic     ,        您不应该设置宽度。默认情况下，页面内容将展开以覆盖整个屏幕。 如果需要查找元素的实际宽度，则始终可以找到。如果您使用的是jQuery，

var width = $(\"#my-element\").width()

    ,        如果了解您的意思，听起来好像您设置的边距设置不正确。 要使内容居中，您将希望代码看起来像这样：http://jsbin.com/uyolo4/4/edit