close

將自定欄位連結框樣式表置入自訂樣式中

超連結框範例:


(2008/08/05修正,原因:教學文章少貼原始檔文字)


可連續串接 46個超連結框







 


PS:引用時請勿刻意改變文章格式,直接由引導複製箭頭反白下拉至
文章頁底複製貼入文章編輯,不要預覽,不用切換至HTML,直接按發
表,以免產生格式上的錯誤,在此叮嚀!自訂樣式與自訂欄位不同,語
法應用時不要貼錯地方



























將自定欄位連結框樣式表置入自訂樣式中-增加有限的字元寫入,五個欄位同時使用,可共同宣告相同超連結框模式規則, (二度空間)語法應用編輯

將以下樣式表複製加入自訂樣式最底層(樣式參考)
#fi1{border:4px double #FFFFFF;background:url(http://img181.imageshack.us/img181/8651/30750664dm3.gif);padding:3px}
#fi2, #fi3{border:4px double #FFFFFF;margin-top:6px;margin-bottom:3px;background:#5511BD;padding-top:2px;}
#fi2 a{color:#FFFF00;}
#fi3 a{color:#00FFFF;}

應用語法解說
#fi1{border:4px double #FFFFFF/*主外框線樣式*/;background:url(http://img181.imageshack.us/img181/8651/30750664dm3.gif)/*主外框線底圖網址*/;padding:3px/*主外框線底圖顯示墊充程度*/;}
#fi2, #fi3{border:4px double #FFFFFF/*超連結框線樣式*/;margin-top:6px/*與主外框靠上邊界距離*/;margin-bottom:3px/*與主外框靠下邊界距離*/;background:#5511BD/*超連結標題背景底色*/;padding-top:2px/*超連結標題與內框線上邊線的距離;}
#fi2 a{color:#FFFF00/*上框超連結標題字體顏色*/;}
#fi3 a{color:#00FFFF/*下框超連結標題字體顏色*/;}

將以下連結框 id 複製加入自訂欄位中,可連續串接 23組,每組為上下兩個連結框,合計 46個連結框
<div id="fi1">
<div id="fi2"><a href="超連結網址">連結標題</a></div>
<div id="fi3"><a href="超連結網址">連結標題</a></div>
</div>

重點說明
46個連結框,無論串接幾個,需要在最前框與最後框加入 <center><div id="fi1"><串接 id></div></center> 以便將文字置中,其中 <div id="fi1">為主外框線 id

PS:串接時,只要再串接<div id="fi2">~<div id="fi3">,然後改變其中連結網址即可


例如:


<center><div id="fi1">
<div id="fi2"><a href="超連結網址">連結標題</a></div>
<div id="fi3"><a href="超連結網址">連結標題</a></div>
/*-------------------------以下連續串接-------------------------*/
</div></center>



另開視窗開啟
在超連結語法中加入 target="_blank" 以新視窗開啟

例如:<a target="_blank" href="超連結網址">連結標題</a></div>




英文色碼表 數字色碼表


框線條樣式 : ( 無、 點線、 實線、 雙線、 溝線、 脊線、 嵌入線、浮出線 )
相對應語法 : none︱ dotted|solid︱ double︱ groove︱ ridge︱ inset︱ outset


貼語法路徑管理部落格管理自定欄位→填寫自定欄位名稱→將語法貼入自定欄位內容→按儲存


PS :重新修改時,語法建議重貼


自訂欄位檢圖說明範例→http://xs320.xs.to/xs320/07442/W6-5.jpg



祝您使用愉快


 

arrow
arrow
    全站熱搜
    創作者介紹
    創作者 單車佬 的頭像
    單車佬

    單車佬的樂活天地

    單車佬 發表在 痞客邦 留言(0) 人氣()