武林網(wǎng)(www.survivalescaperooms.com)文章簡介:別看有的東東長得個表格樣,其實是披著表格皮的無序列表,為了偉大的語義,我們需要用css實現(xiàn)表格外觀的無序列表。
別看有的東東長得個表格樣,其實是披著表格皮的無序列表,為了偉大的語義,我們需要用css實現(xiàn)表格外觀的無序列表。
個人喜好,這里采用border和negative margin來實現(xiàn),非常簡單:
運行代碼框
[Ctrl+A 全部選擇 提示:你可先修改部分代碼,再按運行]
這是一個最簡單的模型,然而,實戰(zhàn)總是殘酷的:
問題1:寬度如何自適應(yīng)分辨率?
這個問題也許有人說沒必要,但是在模塊化設(shè)計時,幾乎任何部件都被要求設(shè)置為寬度自適應(yīng)模式的。
解決1:參考完美的firefox3和ie8百分比寬度處理方案,給剩余的寬度分配給某個“列”,就行了 ^-^
記得二列等高的笨辦法嗎?——用背景圖片模擬。
問題2:單元格內(nèi)容過多、形成換行如何處理?
解決2:隱藏吧,它已經(jīng)沒有存在的價值了!( - -! 其實是我想不出別的辦法來了)
但為了體驗好一點,我加上了text-overflow。這個,F(xiàn)F暫時不支持……aoao有好的解決辦法,我也有次點的解決辦法。
運行代碼框
[Ctrl+A 全部選擇 提示:你可先修改部分代碼,再按運行]
新聞熱點
疑難解答