自舉3（CSS）幾個小問題

Question

我創建了一個網站項目，並使用自舉3 - 我在與一些地方的幾個問題：

網站在大亮點：http://2.ii.gl/9qDvim.png

小窗口中的網站：http://1.ii.gl/VA7OgN.png

1）背景圖像：當我使窗口變小時，圖像調整大小到某一點然後停止。在移動設備中 - 隱藏着大量的溢出。有什麼方法根據窗口大小來調整它的大小？

我當前的CSS代碼：

#wrap { 
    min-height: 100%; 
    height: auto; 
    /* Negative indent footer by its height */ 
    margin: 0 auto -50px; 
    /* Pad bottom by footer height */ 
    padding: 0 0 50px; 
    background:url("/images/bgg5.jpg") no-repeat; 
    background-size: cover; 
} 

2）輸入域 - 它是在調整中的瀏覽器小太多 - 有沒有一種方法，以防止它調整，除非窗口寬度大於長度較小輸入字段？

這是怎麼看起來像在移動：http://4.ii.gl/9oQ7Hp.png

我1個輸入域代碼：

<div class="form-group"> 

       <label for="inputID">Input</label> 

       <div class="row"> 

        <div class="col-xs-4"> 

         <div class="input-group"> 

          <span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span> 

          <input type="text" class="form-control" placeholder="Enter Input" name="login"> 

         </div> 

        </div> 

       </div> 

      </div> 

Answer 1

1. 不，你的圖像沒有足夠的高度以任何調整此外，background-size:cover意味着它必須覆蓋整個屏幕而不丟失比例。嘗試爲移動設備設置自定義背景位置css，這樣背景可以顯示您想要的正確部分。

2. 你的div的寬度有一個類col-xs-4，這使得任何屏幕的寬度的33％大於或等於x-small。要在手機中以全角顯示，可以嘗試將其更改爲col-xs-12 col-sm-4。