首頁 > web前端 > css教學 > 如何在 Twitter Bootstrap 中新增行之間的垂直空間而不修改「row」類別?

如何在 Twitter Bootstrap 中新增行之間的垂直空間而不修改「row」類別?

Linda Hamilton
發布: 2024-10-30 09:18:27
原創
437 人瀏覽過

How to Add Vertical Space Between Rows in Twitter Bootstrap Without Modifying the

在Twitter Bootstrap 中加入行之間的垂直空間

向「行」元素添加上邊距可以增強網頁的視覺吸引力。然而,不鼓勵直接編輯 Twitter Bootstrap 框架中的「row」類,因為它是頁面結構的關鍵組成部分。

為了解決這個問題,更合適的方法是建立一個新的 CSS 類,例如“top-buffer”,提供所需的邊距。

<code class="css">.top-buffer {
  margin-top: 20px;
}</code>
登入後複製

將此類套用至特定行,您可以新增上邊距,而不會影響「row」元素的預設行為。例如,如果您想要在特定行添加20 像素的上邊距,只需使用以下標記:

<code class="html"><div class="row top-buffer">
  ...
</div></code>
登入後複製

此方法允許您在必要時向各個行添加上邊距,留下核心“row”類未修改。

以上是如何在 Twitter Bootstrap 中新增行之間的垂直空間而不修改「row」類別?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板