|
解決之道
首先，請(qǐng)打開我們的Demo頁面，先自行分析一下。如果您使用Firefox，可以嘗試把CSS樣式禁用進(jìn)行“欣賞”（如果您裝了Web developer toolbar，您可以CTRL + SHIFT + S）。繼續(xù)。
解決dt的橫排
dt與dd交錯(cuò)，如何能夠使得dt排在一行上？well，理論不分析太多，要使它們?cè)谝黄�，我們假設(shè)dd不存在。這樣的話，使用float就能排在一起。既然dd不能不存在，ok，那么讓它們脫離文檔流，如何做？position:absolute;就可以了。但是IE6有問題，wtf . 我的解決方法是，使用JavaScript把所有的dt湊一塊，這樣嚴(yán)重傷害了語義，但這只是一個(gè)瀏覽器問題，而且是在有JavaScript的時(shí)候才產(chǎn)生語義問題，阿彌陀佛，辯證法認(rèn)為事物都具兩面性。
解決dd的自適用高度
對(duì)于已經(jīng)position:absolute;了的dd，無論是理論還是實(shí)踐，使用純CSS都沒有解決方法。同樣，我使用了JavaScript來動(dòng)態(tài)計(jì)算它的每一次高度，然后賦予整個(gè)dl。
局限性與缺點(diǎn)
這樣做保證了標(biāo)準(zhǔn)、語義、Unobtrusive。但對(duì)于少部分擁有能解析CSS的先進(jìn)瀏覽器但卻關(guān)閉了JavaScript的用戶來說，極有可能會(huì)被不能自適用高度的頁簽下的內(nèi)容區(qū)塊擋住了跟隨在后的信息。
s2uTab
很高興我能寫出一些實(shí)用的JavaScript，以上所提到的，我將之命名為s2uTab — 偏要解釋的話，它就是Standard, Semantic, Unobtrusive Tab的縮寫。首先，它很小，不依賴于任何庫，在IE6+, opera 9+, Firefox 2+均通過測(cè)試（若您有Safari，務(wù)必幫忙測(cè)試一下，謝謝）。其次，靈活，除了dl外無須任何鉤子，且頁簽數(shù)目靈活沒有限制。再次，您可以指定頁簽切換的事件形式，可以指定初始的頁簽是哪個(gè)。
出處：Realazy
責(zé)任編輯：moby
上一頁 標(biāo)準(zhǔn)的 語義的 非侵入的頁簽切換 [1] 下一頁 標(biāo)準(zhǔn)的 語義的 非侵入的頁簽切換 [3]
◎進(jìn)入論壇網(wǎng)頁制作、網(wǎng)站綜合版塊參加討論
|
第 1 頁 
第 2 頁 標(biāo)準(zhǔn)的 語義的 非侵入的頁簽切換 [2]
