如何使Bootstrap3中的表單按鈕大小相等？

如何使可見按鈕的寬度相同，而不對每個按鈕固定寬度？有沒有通用的解決方案，將與按鈕的任何大小工作（因爲這是文本依賴）如何使Bootstrap3中的表單按鈕大小相等？

這裏是剪斷：

<div class="btn-toolbar"> 
<button class="btn-success btn btn-default" name="resolution" value="corrected" type="submit">Submit</button> 
<div class="pull-right btn-group"> 
<button class="btn-warning btn btn-default" name="resolution" value="skipped" type="submit">Skip</button> 
<button class="btn-warning btn btn-default" name="resolution" value="not_found" type="submit">Not found</button> 
</div> 
</div>

來源

2016-11-02 Antoniossss

把你的按鈕相同的寬度 –

只需添加上你的按鈕的CSS規則，使他們將有一個大小相等 –

如何做沒有固定的大小設置爲每個按鈕？（如果通過寬度屬性或樣式，則無關緊要） – Antoniossss

它不會使所有的好東西按鈕寬度固定，因爲按鈕的寬度將依賴於按鈕的文本。它看起來不太好。但是，如果它是你必須的，那麼你可以添加一個類到你的按鈕，併爲你的CSS規則分配一個固定的寬度。或者你也可以直接在你的css上設置一個固定的寬度到你的按鈕。但我強烈建議不要這樣做，因爲它不會很好看。添加了這兩種方案

代碼中加入一類

<button class="btn-warning btn btn-default fixed_width" name="resolution" value="skipped" type="submit">Skip</button>

在你的CSS文件

.fixed_width{ 
    width:**YOUR_DESIRED_WIDTH_GOES_HERE**; 
}

，或者直接分配 -

button{ 
    width:**YOUR_DESIRED_WIDTH_GOES_HERE**; 
}

來源

2016-11-02 06:42:50

您只能做到這一點在樣式中設置所需的按鈕寬度。在這個例子中，我給出了所需的寬度爲100px。你可以把它放到你需要的值。

<!DOCTYPE HTML> 
 
<html> 
 
    <head> 
 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
     <style> 
 
     .btn{ 
 
      width: 100px; 
 
     } 
 
     </style> 
 
    </head> 
 
    <body> 
 
    <div class="btn-toolbar"> 
 
     <button class="btn-success btn btn-default" name="resolution" value="corrected" type="submit">Submit</button> 
 
     <div class="pull-right btn-group"> 
 
      <button class="btn-warning btn btn-default" name="resolution" value="skipped" type="submit">Skip</button> 
 
      <button class="btn-warning btn btn-default" name="resolution" value="not_found" type="submit">Not found</button> 
 
     </div> 
 
    </div> 
 
    </body> 
 
</html>

來源

2016-11-02 06:47:46 Nitheesh

如何使Bootstrap3中的表單按鈕大小相等？

回答

相關問題