Question

我正在使用网格系统显示7张小图像，每张图像旁边都有一个数字，它应该像this。在第一个示例中，我没有使用网格系统，但是要复杂得多，我花了60-120分钟才能完成，使用网格系统花了不到10分钟，但我无法调整字体大小。看看here

我尝试覆盖任何可能的font-size属性，并且还尝试为div提供更多类并更改font-size。

注意：我可以轻松更改字体系列。

 <div class="container" style="float: left; font-family: 'Germania One', cursive;">
        <div class="row">
          <div class="col">
            <img src="forca.png" alt=""> 2
          </div>
          <div class="col">
            <img src="destreza.png" alt=""> 3
          </div>
          <div class="col">
            <img src="agilidade.png" alt=""> 2
          </div>
          <div class="col">
             <img src="inteligencia.png" alt=""> 8
          </div>
          <div class="col">
            <img src="resistencia.png" alt=""> 4
          </div>
          <div class="col">
            <img src="fe.png" alt=""> 2
          </div>
          <div class="col">
            <img src="carisma.png" alt=""> 4
          </div>
        </div>
      </div>

Answer 1

 <div class="container" style="float: left; font-family: 'Germania One', cursive;">
        <div class="row">
          <div class="col">
            <img src="forca.png" alt=""> 
            <p style="font-size:2em">2</p>
          </div>
          <div class="col">
            <img src="destreza.png" alt=""> 
            <p style="font-size:2em">3</p>
          </div>
          <div class="col">
            <img src="agilidade.png" alt=""> 
            <p style="font-size:2em">2</p>
          </div>
          <div class="col">
             <img src="inteligencia.png" alt=""> 
            <p style="font-size:2em">8</p>
          </div>
          <div class="col">
            <img src="resistencia.png" alt=""> 
            <p style="font-size:2em">4</p>
          </div>
          <div class="col">
            <img src="fe.png" alt=""> 
            <p style="font-size:2em">2</p>
          </div>
          <div class="col">
            <img src="carisma.png" alt=""> 
            <p style="font-size:2em">4</p>
          </div>
        </div>
      </div>

更改网格系统中的字体大小

1 个答案: