我们可以根据html中屏幕的分辨率动态地压缩表格和文本吗？
我们可以根据html中屏幕的分辨率动态地压缩表格和文本吗？
提问于 2012-03-18 14:51:59
我设计了一个使用1366*768分辨率全屏的网页。现在，如果我用其他分辨率查看我的网页，所有div标签都会重叠。我把我所有的网页都放在一个表格里来纠正这个问题..但我还是得到了一个较低分辨率的卷轴..我们可以做一些事情，比如根据分辨率减小字体和图像大小。
回答 1
Stack Overflow用户
发布于 2012-03-18 15:15:16
基于表格的布局通常是一个非常糟糕的想法。让网页在不同分辨率下看起来更漂亮的最好方法是，使用带有宽度属性的div。一个小的例子是：
CSS：
#main{
width: 70%;
position: absolute;
left: 25%;
top:0px;
}
#left{
position: absolute;
left: 0px;
width:20%
}
img{
width: 100%;
}
HTML：
<div id="left">
<p>
This is the left coulmn.<br />
This is the left coulmn.<br />
<img id="picture1" src="pic.png" />
</p>
</div>
<div id="main">
<p>
This is the main div with a lot of text.
This is the main div with a lot of text.
This is the main div with a lot of text.
This is the main div with a lot of text.
This is the main div with a lot of text.
</p>
</div>使用浮动而不是绝对位置也是一种常见的解决方案，为了归档不同的列两个答案，你的问题是降低基于分辨率的fon大小:这是可能的，使用Javascript (获取分辨率，动态更改图像大小)。但这会滥用web技术--所以只需使用CSS百分比属性即可。如果您在特定情况下需要帮助，请发布您的基本页面结构的代码。也可以在谷歌上搜索"CSS 2/3列布局“。
编辑：简短的示例代码+插入img标签
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/9756588
复制相关文章
相似问题
腾讯云开发者
