css，我幾乎都從w3school學來的。簡潔好用。
我個人不用class了。可以完全換成 attribute 或特製標籤。如果數據都一堆 class 和 span, 你寫正則會很辛苦。像 span, div，我限制於固定的層次，最好避開全面施用。
@匿名1303
before, after 可以完全替代介面重複的文字。好處是可以通過css改變內容，而不用編輯mdx。這樣數據保持瘦削而不膨脹。瘦削就更方便使用正則、手工編輯數據，不僅是體積問題。
@Mastameta 兄，不很清楚 attribute 怎麼用，before ，after 也是剛看到 @alexpeng 那個有點好奇後才去弄懂，以前沒注意過怎麼用，css 我沒很系統的去理解，大都是看效果後，抄抄改改 
亂套用
您說的固定層次，個人覺的很有必要，因若太多層，蠻複雜的，正則也不是很精通，也很難處理
剛搞懂那個 before ，after 就可以改善我的一個div 的結構，也省下用正則再去處理，您說的 一堆 class ，span，div，也是我目前的問題，實在沒什概念簡化
這是用 mdictool 合并的，但感覺不很適合，因最上面那個eye 1-12 我想替代成括號內字根，但有困難，正則可能沒法處理
1 个赞
關於削減，比方說：
<span class="headword">
不如用特製標籤：
<hw>
如果這個 <hw> 需要加上類似 class 的分辨，就加個 attribute：
<hw phrase>
<hw idiom>
這比 class="phrase" 省略。在CSS裡，用 hw[phrase] 來選上。before 就是 hw[phrase]::before
用正則時，這標籤的閉合是較獨特的 </hw>，而不是氾濫的</span>。氾濫，用正則較麻煩，較容易出錯。
這個 attribute 還有別的玩法，現在出門了，下次再聊。
1 个赞
哇！厲害了，好像有看過這樣的處理，但沒去理解過用法，也不會用，就一直渾渾噩噩的亂套亂用 <span class="headword">這樣的方式， 謝謝@Mastameta 兄，指點迷津提供好的處理方法 
aabbcc
aa, bb, cc, aabbcc
@Mastameta @alexpeng 兄，請教一下，困擾蠻久的一個問題，若在aabbcc 單字中，用 a href 的轉跳的方式，該如何才能，點 aa，bb，cc，aabbcc 各自轉跳，aa，bb，cc，是沒有問題的但若要 aabbcc 也可以轉跳，則aa，bb，cc會卡住也是跳往 aabbcc
<a href="entry://aabbcc"><a href="entry://aa">aa</a><a href="entry://bb">bb</a><a href="entry://cc">cc</a></a>
a标签可以这样嵌套用吗？这个还真不知道，一会搜索看看。
@alexpeng 兄，我也不清楚，若外面那個<a href="entry://aabbcc">不要套上去，應該是沒問題，但如果有此需求，可有解
最外面那層應該是沒法跳，剛試了下，好像沒有反應
<a href="entry://aabbcc"><object><a href="entry://aa">aa</a><a href="entry://bb">bb</a><a href="entry://cc">cc</a></object></a>
還沒試，不知是否可行
这个帖子似乎有解决方法，希望对你有帮助。
謝謝 @alexpeng 兄，好像有點難懂…
我也不懂 
我不是很了解你要的效果，這些aa, bb是代表漢字還是羅馬字的詞目？anyway, href 鏈接夾在另外 href 中，不合理。
你好像要的是：
<a href="entry://aabbcc">aabbcc</a>
然後 mdx 要提供跳轉設備：
aabbcc
@@@LINK=aa
</>
aabbcc
@@@LINK=bb
</>
aabbcc
@@@LINK=cc
</>
aabbcc才會同時跳三處。（我們甭太離題，應當討論圖片詞典呵呵）
@Mastameta 兄，您有點誤解在下想要轉跳的方式，最外那層是箝套，不知是否可以實現，@@@LINK那樣的跳轉不太適合想弄的材料
<a href="entry://aabbcc"><a href="entry://aa">aa</a><a href="entry://bb">bb</a><a href="entry://cc">cc</a></a>
_---------------------------------------
<a href="entry://aa">aa</a><a href="entry://bb">bb</a><a href="entry://cc">cc</a>
aa, bb, cc 可以轉跳 OK
但若想在同一詞條轉跳 aabbcc ，不知可行否？
鏈接夾在鏈接，這樣怪怪的。分別列出四個鏈接就可以了。
確實是怪怪的，因為不知如何實現
maybe…
<a href="entry://aabbcc"> # </a><a href="entry://aa">aa</a><a href="entry://bb">bb</a><a href="entry://cc">cc</a>
# aabbcc
點擊 井字號 轉跳 aabbcc 應該是沒問題 
那樣可以。那個 aabbcc 目的地，在界面上怎麼標都無所謂。
嗯嗯，好的，謝謝啦！
切回 before 的話題，標籤叫 <a combo href="entry://aabbcc"></a>
CSS：a[combo]::before {content:"#"; margin-right:.5em} 之類的。
（因為鏈接原來沒標題目，就不分前後，所以這裡換用 ::after 會有等同的效果。）
2 个赞
@Mastameta 兄，您的完整標簽意思是否是 <a combo href="entry://aabbcc"></a>
然后在css內加上那行井字號就可以出現，讚！厲害了 
漂亮了！，又學到了一招好用的方法，嗯嗯，理解了，漂亮，漂亮
關於 # 前後的空白，一般來說，html 中最好別用鍵盤打出的空白來安排空間佈局。用 CSS margin。這樣可以更準確控制隔離的大小，數據也更容易維護，因為沒有多餘的東西。別加空白，除非是真正內容（例如英文詞之間的空白）。
1 个赞
嗯嗯，理解，這方法也彈性，還好您提醒了一下，不然我真沒想到這個功用，謝謝 @Mastameta 兄指點迷津，太感謝了！