響應式字體大小與Twitter引導

Question

如何使字體大小響應與Twitter引導？

我寫了一個完全響應寬度的代碼，但字體沒有響應。正如你在下面的屏幕截圖（Android默認瀏覽器）中看到的，字體大小和文本框也非常小。如何解決這個問題？

<form role="form"> 
    <div class="form-group"> 
    <label for="exampleInputEmail1">Email address</label> 
    <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Enter email"> 
    </div> 
    <div class="form-group"> 
    <label for="exampleInputPassword1">Password</label> 
    <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password"> 
    </div> 
    <div class="form-group"> 
    <label for="exampleInputFile">File input</label> 
    <input type="file" id="exampleInputFile"> 
    <p class="help-block">Example block-level help text here.</p> 
    </div> 
    <div class="checkbox"> 
    <label> 
     <input type="checkbox"> Check me out 
    </label> 
    </div> 
    <button type="submit" class="btn btn-default">Submit</button> 
</form> 

Answer 1

您可以使用媒體查詢類似這樣的例子http://jsbin.com/pupuburu/1

嘗試調整窗口。

Answer 2

我也在我的項目中用媒體查詢解決了這個問題。像這樣：

@media (max-width: 991px) {  
    body { 
     font-size: 12px; 
    } 
} 

@media (min-width: 992px) { 
    body { 
     font-size: 14px; 
    } 
} 

@media (min-width: 1200px) { 
    body { 
     font-size: 16px; 
    } 
} 

這種方法對我很好，但也許有更聰明的解決方案？！