放大DIV标签
昨天我问了How to make text vertically and horizontally center in an HTML page一个问题，关于在页面中间居中显示文本(垂直和水平)的方法。
解决方案运行良好，但现在我想增加文本大小，但问题是我不想使用'px‘一样的单位度量，因为这是一种静态的方式，不能适应所有的屏幕大小。
因此，我希望对文本使用百分比单位度量。
HTML代码：
<body>
<div class="my-block">
WORD1<br />
WORDWORDWORDWORD2
</div>
</body>我面临的困难是<div />的高度。我不能将div的高度设置为等于body的高度，宽度是相等的，因为div是一个块元素，但我如何将body的高度设置为等于div的高度
我已经尝试将padding和margin设置为0，将height设置为100%，但都不起作用。
有谁可以帮我？
回答 2
Stack Overflow用户
发布于 2012-03-23 20:28:21
我想这就是你需要的：
<style type="text/css">
html {height: 100%;}
body {margin: 0;padding: 0;height: 100%;}
.my-block {height:100%;}
</style>将其付诸实践：100% height
然而，如果你想让你的文本“适应”所有的屏幕尺寸，那就有个问题。与font-size一起使用的百分比和EM单位完全相同(至少在理论上，尽管%在兼容性方面更好)-它们根据文本的实际像素大小进行缩放。换句话说，font- size :xx%不会根据容器的高度或宽度缩放文本，而是基于当前的文本大小。
请参阅css font units
你可以通过使用来实现你想要的东西。但是，我建议您不要这么做。让用户决定是否需要放大/缩放。
干杯!
Stack Overflow用户
发布于 2012-03-23 19:12:42
它可以工作，但问题是主体没有填满视口的高度。还可以添加以下内容：
html,body{
margin: 0;
padding: 0;
height: 100%;
}jsFiddle with your original code.
https://stackoverflow.com/questions/9838128
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号