asp.net中如何设置元素大小与浏览器相同
Posted
技术标签:
【中文标题】asp.net中如何设置元素大小与浏览器相同【英文标题】：how to set the size of the element same as that of browser in asp.net 【发布时间】：2011-09-18 16:00:09 【问题描述】：我正在制作一个网站，其中我有一个母版页。我已经在母版页中设置了元素的宽度和高度以适合 Firefox 浏览器，因此当我在其中打开我的页面时它工作正常，但是一旦我切换到 Chrome、opera 或 IE，页面不适合整个浏览器区域。该页面比浏览器的查看区域更小（显示空白）或更大（获得滚动条），并且功能很明显，因为我已经硬编码了宽度和高度以适应 Firefox。我也知道，当我在 Firefox 中打开同一页面但在其他人的计算机中时，至少会出现一些失真（由于分辨率不同）。
是否有人有 javascript/c# 代码，我可以使用它来根据打开的浏览器动态设置元素的大小？以下是我的母版页的 html。我已经用粗体突出了我为 Firefox 设置的代码。
渡//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">【问题讨论】：
【参考方案1】：为什么不使用 CSS 来设置客户区的样式？
你可以使用
width: 100%;
height: 100%;
要获取一个元素，请使用所有可用空间。我认为在 c# 中计算服务器端的大小不是一个好主意。
【讨论】：
我知道为此添加服务器端代码不是一个好主意，但只是为了它而添加它。至于宽度和高度 = 100%，我试过了，但它不起作用，但会再试一次。但是一个 javascript 会创造奇迹。 当然，您必须将 100% 应用于每个元素，例如body - div - table - tr 等...【参考方案2】：一般情况下，您应该将主容器(Div or table) 的宽度设置为percent 或pixel。当您将其设置为 100 (100%) 时，它将覆盖每个浏览器中的所有页面。
如果您以像素为单位设置主容器，则 920 像素大约是好的。
但是您应该使用margin:0px auto css 属性将您的容器放置在页面中心。
对于您的内部元素，您可以同时使用百分比和像素。因为你之前已经设置了主容器width。
【讨论】：
【参考方案3】：你可以像这样使用css：
width: 100vw; // 100% of viewport width
width: 100vh: // 100% of viewport height
这应该可以工作，因为视口是指当前设备
【讨论】：
以上是关于asp.net中如何设置元素大小与浏览器相同的主要内容，如果未能解决你的问题，请参考以下文章