html根据浏览器大小增加的百分比增加元素宽度
html根据浏览器大小增加的百分比增加元素宽度
提问于 2014-01-07 10:58:46
我有一些关于html和css的问题。
情况就是这样。我正在构建一个移动网络，我的基线是240 is宽。因此，我所有元素的尺寸都是基于240屏幕大小设置的。但当我在三星Galaxy这样的大手机上查看网页时，会注意到。所有的东西似乎都太小了，用户不能点击它。
现在的问题是，是否可以使用可变类型的css的宽度和高度？比方说，我在240 in宽设备中使用的缩略图是50 in，所以当我在480 in宽度设备中查看缩略图时，缩略图将以100 in显示，这意味着缩略图将根据屏幕增加的百分比增加其大小。
回答 4
Stack Overflow用户
回答已采纳
发布于 2014-01-07 11:01:25
是的，显然可以，您正在寻找的是响应设计，要完成这个任务，您需要@media查询。
演示 (调整窗口大小以查看效果)
div {
height: 200px;
width: 200px;
background-color: tomato;
}
@media all and (max-width: 400px) {
div {
height: 100px;
width: 100px;
}
}Stack Overflow用户
发布于 2014-01-07 11:03:35
使用百分比作为您的宽度，而不是固定宽度，以使图像响应。
例如，使用100%而不是50 of。它将自动填充容器(容器也在其中响应)，并在浏览器上自动调整大小。
Stack Overflow用户
发布于 2014-01-07 11:04:44
是的，这是有可能的，响应性的设计实现了以下方式，
%中的所有维数- 媒体查询
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/20969884
复制相关文章
相似问题
腾讯云开发者
