5/9 完成後臺部分的簡陋介面 bootstrap的垂直分割佈局
阿新 • • 發佈:2019-01-30
直接上一張我認為我寫的裡面最複雜的一個頁面好了(雖然非常簡單):
(請忽略右下角的網易雲音樂)
<h1>、<hr>什麼的昨天說過了,今天說說新用到的row和span系列
如果大家還記得的話,之前的三個表格是一溜豎著排下來的,雖然我的審美非常有限也覺得實在是太醜了而且也不方便使用者用,所以去查了一下用bootstrap垂直分割佈局的辦法:
在一個div中,bootstrap會自動的把區域分為12列,這樣,想把裡面的內容分為3列的話就寫三個<div class="span4"></div>就好。我用到的程式碼如下:
注意如果發現有問題,其他內容會錯誤的跑到你的幾列的同一行上的時候,用<div class="row"> <div class="span4"> <table class="table table-hover"> ... </table> </div> <div class="span4"> <table class="table table-hover"> ... </table> </div> <div class="span4"> <table class="table table-hover"> ... </table> </div> </div>
<div class="row"></div>
框起來就好了。