如何使字体大小自动适应手机版本

我正在使用Twitter Bootstrap创建网站;该网站现在在桌面或笔记本电脑上看起来不错，但是当我在移动设备上查看时，字体大小不会适应屏幕尺寸。有人能告诉我如何解决这个问题吗？如何使字体大小自动适应手机版本

<section class="box"> 
    <img src="images/background2.jpg" class="img-responsive" alt=""> 
    <div class="carousel-caption"> 
     <h1>Do you love to scuba dive? Are you looking for your next bid dive event?  
     </h1> 
     <p>Look no further. Join ABI and other experienced divers throughout the year as we travel to amazing ocean resort destinations for state of the art diving experiences. Each trip will include 
     multiple dives operated by experienced dive companies. All proceeds from these diving excursions will benefit the ABI Endowment Fund 
     <a href="http://endowment.abi.org" target="_blank"> [endowment.abi.org]</a> 
     Do something you love while supporting the ABI Endowment Fund. Get more information about ABI's upcoming dive excursions. 
     </p> 
    </div> 
</section>

enter image description here

来源

2014-03-02 Xinrui Ma

你真的希望字号变小吗？它可能很难在移动设备上阅读。 –

html { font-size: 62.5%; } 
body { font-size: 1em;} 

@media (max-width: 300px) { 
    html { font-size: 70%; } 
} 

@media (min-width: 500px) { 
    html { font-size: 80%; } 
} 

@media (min-width: 700px) { 
    html { font-size: 120%; } 
} 

@media (min-width: 1200px) { 
    html { font-size: 200%; } 
}

试试这个:) http://jsfiddle.net/yv5eu/

来源

2014-03-02 20:43:37 Nick