table和ul的區別？

ul-li：用浮動和百分比

ul-li：用彈性盒子

今天糾結的小點：

如果要行可點擊時，排除 table，用 ul。

如果有頁簽切換，直接用 table 不可行：如果寬度純自適應，那切換時列表看起來會抖，體驗不好

寬度的分配問題：百分比不好設置，尤其移動端屏幕寬度不定。有時窄屏下剛剛好的比例到寬屏下就有些空蕩不協調了；寬屏下合適的比例在窄屏下又被擠的掉下去了-這個很嚴重的。

先說說這三種布局的特點：

table

1.沒有行點擊的，可用

2.沒有頁簽切換的，可用：要保證tab切換時視覺上的不抖動，就得設置百分比。

3.列中有換行，同行要保持垂直對齊的

總之：橫豎的對齊+內容的自適應+行不會掉下來，這三點就讓原生的 table 天生棒棒噠。

但是一旦要加額外限制，table 就顯得有點重了。額外限制包括：行可點擊-不能實現；不同即有寬度-又有樣式限制限制-html層次就深了。

float 加 %

兼容性挺好：各種瀏覽器都支持，而且表現也較一致

問題1：移動端寬度設置不好設置—原因如今天糾結的3—你看，這個時候table就比較好了-原生的對齊就很協調

問題2：一個寬度要改，其余的比例也都要適當地重新計算再修改，不方便。

問題3：多行時，列的對齊又不好控制-當列的寬度不是定死的時候。靈活就會導致潛在的不對齊。