可做出「樹狀分類」的語法 - 部落格

在網路上無意間發現的語法

先創一個自由欄位，格式選擇「不自動換行」，然後貼入下列文字：


<style>ul.mktree li { list-style: none; }ul.mktree, ul.mktree ul , ul.mktree
li { margin-left:10px; padding:0px; }ul.mktree li .bullet {
padding-left: 15px; }ul.mktree li.liOpen .bullet { cursor: pointer;
background: url(http://finalevillee.googlepages.com/minus.gif) center left
no-repeat; }ul.mktree li.liClosed .bullet { cursor: pointer; background:
url(http://finalevillee.googlepages.com/plus.gif) center left no-repeat;
}ul.mktree li.liBullet .bullet { cursor: default; background:
url(http://finalevillee.googlepages.com/bullet.gif) center left no-repeat;
}ul.mktree li.liOpen ul { display: block; }ul.mktree li.liClosed ul {
display: none; }ul.mktree li { font-size: 10pt; }ul.mktree li ul li {
font-size: 10pt; }ul.mktree li ul li ul li { font-size: 8pt; }ul.mktree li
ul li ul li ul li { font-size: 6pt; }</style><script
src="http://finalevillee.googlepages.com/tree.js"></script>
<ul class="mktree">

<li><a href="大分類1的網址">大分類1</a>
<ul>
<li><a href="小分類1的網址">小分類1</a></li>
<li><a href="小分類2的網址">小分類2</a></li>
</ul>
</li>

<li><a href="大分類2的網址">大分類2</a>
<ul>
<li><a href="小分類3的網址">小分類3</a></li>
<li><a href="小分類4的網址">小分類4</a></li>
<li><a href="小分類5的網址">小分類5</a></li>
</ul>
</li>

</ul>

<script>convertTrees();</script>



其中
http://finalevillee.googlepages.com/minus.gif
http://finalevillee.googlepages.com/plus.gif
http://finalevillee.googlepages.com/bullet.gif
都是可更改的圖檔

大分類中的小分類數量可隨喜好增減



目前我覺得這個語法唯一明顯的缺點就是在側邊欄位裡只能用一次，

如果有兩個欄位同時貼了這樣的語法的話會出現一點點小問題...


範例請見：
http://blog.roodo.com/leoraph/

--