在css3中,使用calc()以vh和vw垂直居中 [英] in css3, use calc() to center vertically with vh and vw
本文介绍了在css3中,使用calc()以vh和vw垂直居中的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
在一个广泛使用的情况下,使用 vh
获取 div
的高度, code> vm 。
in what has to be a widely used case, using vh
for height of a div
, and using vm
for font size.
div.outer { height: 20vh; }
div.inner { font-size: 3vw; height: auto; }
div.inner2 { font-size: 2vw; }
html - case 1
html - case 1
<div.outer>
<div.inner>center me!</div>
</div>
html - case 2
html - case 2
<div.outer>
<div.inner>center me top!</div>
<div.inner2>center me bottom!</div>
</div>
有任何方法使用 calc()
和其他 css3
属性中,以 div.outer c中的
div.inner
/ code>?
is there any way to use calc()
and other css3
properties to vertically center the div.inner
within the div.outer
?
推荐答案
如果你只使用一行,你可以使用 :20vh;
。
If you only use one line you can use line-height: 20vh;
.
这篇关于在css3中,使用calc()以vh和vw垂直居中的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文