引導手機屏幕

Question

3大按鈕，跳出超大屏幕的在我的佈局，我有一個超大屏幕的大按鈕，呼籲採取行動

<a href="#" class="btn btn-lg btn-success">Let's Buy Something Fancy</a> 

然而，在XS移動視圖，該按鈕就會中斷在超大屏幕的，看下面的截圖：

http://screencast.com/t/d3VJRps0Rx7

我嘗試添加的行&新列，然後更改爲「BTN-塊」 - 雖然按鈕停留在超大屏幕，文本還是滲出。

有沒有辦法讓按鈕在小型手機屏幕上縮小尺寸？也許從大到正常？

Answer 1

你可以使用媒體查詢來按比例縮小的更小的設備..按鈕

@media (max-width: 768px) { 
    .btn-responsive { 
    padding:2px 4px; 
    font-size:11px; 
    line-height: 1; 
    border-radius:3px; 
    } 
} 

@media (min-width: 769px) and (max-width: 992px) { 
    .btn-responsive { 
    padding:4px 9px; 
    font-size:12px; 
    line-height: 1.2; 
    } 
} 

演示：http://bootply.com/109303

Answer 2

它似乎是強制按鈕流血的文本的長度和大小。 一個解決方案可能是在與引導程序相同的斷點處使用媒體查詢更改字體大小。