能否用CSS调整字体大小到div宽度？

Question

我有一个带有 70% 宽度，而我要做的是。

• 在那个div里放一些字
• 调整字体大小，使这些字占据所有div宽度。

---

只用css可以吗？这是我的代码。

.parent {
  width:70%;
  height:auto;
  min-height:100px;
  background:red;
  font-size:10vw;
}

Please help me to change the font-size dynamically to the parent class
<hr>
<div class="parent">
  This Text
</div>

注意： div 尺寸是响应式的这很重要。先谢谢你

Answer 1

也许不是你要找的，但是你可以让字体和元素都相对于视图宽度。

p {
  font-size: 5vw;
  background-color: red;
  width: 50vw;
}

<p>
  I'm a P!
</p>

Answer 2

你只需要添加 display: inline; 在你的代码中

.parent {
  width: 70%;
  height: auto;
  min-height: 100px;
  background: red;
  font-size: 10vw;
  display: inline;
}

<div class="parent">
  This Text
</div>

Answer 3

**You can change font-size:10vh;**
        .parent {
      width:70%;
      height:auto;
      min-height:100px;
      background:red;
      color:white;
      font-size:10vh;
    }
    Please help me to change the font-size dynamically to the parent class
    <hr>
    <div class="parent">
      Text
    </div>

Answer 4

在这里，我更新了它.... JS Fiddel

试用

css

.parent 
 {
      width:70%;
      height:auto;
      min-height:100px;
      background:red;
      font-size:10vw;          
  }



span{
      display:inline-block;
      transform:scale(1.8,1);
      -webkit-transform:scale(3,1);
 }

超文本标记语言

<div class="parent">
  <span>This Text</span>
 </div>

Answer 5

是的，但我认为你需要使用JS(jQuery)。

JS(jQuery)。

$(function(){

var box = $('.box');
var boxWith = box.width();

$('.box h1').css('font-size',boxWith);

});

https:/jsfiddle.netmoongod101sdfaatp8。