调整不同屏幕尺寸的内容？
[英]Resizing content with different screen sizes?
问题描述
I am trying to make a single page website.
我正在尝试制作一个单页网站。 I have a different container for each section which has a height of 100vh so the container resizes for different screens but the content does not which makes the website go all awry on small screens.我为每个部分都有一个不同的容器，高度为 100vh，因此容器会针对不同的屏幕调整大小，但内容不会使网站在小屏幕上出错。 How do I make the content resize as well with the container.如何使内容与容器一起调整大小。
2 个解决方案
解决方案1
0 2016-05-28 03:53:36
Maybe this can help也许这可以帮助
<HTML>
<HEAD>
<style>
.resizer{
min-width:700px;
margin-left:10px;
overflow:hidden;
}
</style>
</HEAD>
<BODY>
<div class='resizer'>
YOUR CONTENT goes here
</div>
</BODY>
</HTML>
You may also want to look at CSS: Auto resize div to fit container width您可能还想查看CSS: Auto resize div to fit container width
解决方案2
0 2016-05-28 03:54:04
The easiest thing you could do is go for a HTML5 responsive framework such as Bootstrap or use CSS media queries like shown here (or see below for quick example).你可以做最简单的事情就是去一个HTML5响应的框架，如引导或使用CSS媒体查询，如显示在这里（或请参阅下面的简单的例子）。 Other than that it would probably involve javascript with similar end result to the aforementioned two ways.除此之外，它可能会涉及与上述两种方式类似的最终结果的 javascript。
@media screen and (min-width: 480px) {
body {
background-color: lightgreen;
}
}
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.