覆蓋引導程序默認值的選項

我注意到Bootstrap的form-control類不再保留display: inline-block一個屏幕寬度變得小於768px。爲了覆蓋這個我不得不設置覆蓋引導程序默認值的選項

.form-control { 
    display: inline-block !important; 
}

這是唯一一個圍繞CSS規則？我必須使用!important嗎？我嘗試給元素另一個類，如display-inline-block使用與上面相同的CSS，但沒有使用!important，但它不起作用。用0123'覆蓋Bootstrap會感覺很奇怪，因爲我被教導要儘量避免使用它，但是有沒有其他解決方法？

來源

2016-10-16 stackjlei

正如你可以看到here的display: block;聲明適用於在根.form-control CSS類，所以，爲了覆蓋它，應該足以把.form-control { display: inline-block; }引導後inlude：

<html> 
 
     <head> 
 
     
 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" /> 
 
     
 
     <style> 
 
      .form-control { 
 
      display: inline-block; 
 
      } 
 
     </style> 
 
     
 
     </head> 
 
     <body> 
 

 
     <!-- INSPECT THIS ELEMENT --> 
 
     <input class="form-control" /> 
 

 
     </body> 
 
    </html>

來源

2016-10-16 08:12:18 Hitmands

當我把它放到我的master.css中時，它不起作用，它通過webpack綁定到我的bundle.js中，這是我在鏈接到引導之後運行的腳本。這是爲什麼？ – stackjlei

實際上這並沒有工作，即使當我做了，因爲你顯示的CSS放在頭標記 – stackjlei

你需要控制如何通過webpack綁定模塊的順序，檢查'檢查器... ...我的解決方案**必須**，因爲css代表'CASCADE樣式表「。 – Hitmands

覆蓋引導程序默認值的選項

回答

相關問題