★將自訂欄位圖片式超連結樣式表置入自訂樣式中☆ - a5313989

↓

將自定欄位圖片式超連結樣式表置入自訂樣式中圖片式超連結範例：

連續串接覺的太長是嗎?給它加個捲軸(滑軌)

本篇沒有測試總共可置入幾個超連結按鈕圖片，請有需要的網友自行測試

PS：圖片型式需自行製作上傳圖片空間，取得連結網址，圖片尺寸預設建議 100pxX40px

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

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

將以下樣式表複製加入自訂樣式最底層(樣式參考)

應用語法解說

貼語法路徑 → 管理部落格 → 面板設定 → 自訂樣式 →加入語法→確定

自訂樣式檢圖說明範例→ http://xs320.xs.to/xs320/07421/W6-4.jpg

#fi1{text-align:left;WIDTH:130px;HEIGHT:250px; OVERFLOW: auto;} #fi2 a {border:2px double #9900CC;} #fi3 a {border:2px double #ff0000;} #fi2 img, #fi3 img {WIDTH:105px;HEIGHT:40px;border:0px;margin-top:5px;}

將以下連結 id 複製加入自訂欄位中，可連續串接，每組為上下兩個不同邊線作區分

重點說明

無論串接幾個超連結，需要在最前框與最後框加入 <center><串接 id></center> 以便將超連結欄位置中。

應用如下：

<center> <div id="fi2"> <a href="超連結網址"><img src="https://images.unsplash.com/photo-1606414759315-51d7de3c6db9?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=320&w=640" data-src="https://images.unsplash.com/photo-1606414759315-51d7de3c6db9?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=320&w=640"></a></div> <div id="fi3"> <a href="超連結網址"><img src="https://images.unsplash.com/photo-1606414759315-51d7de3c6db9?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=320&w=640" data-src="https://images.unsplash.com/photo-1606414759315-51d7de3c6db9?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=320&w=640"></a></div> /*-------------------------以下連續串接-------------------------*/ </center>

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

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

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

另開視窗開啟

例如：<a target="_blank" href="超連結網址"><img src="https://images.unsplash.com/photo-1606414759315-51d7de3c6db9?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=320&w=640" data-src="https://images.unsplash.com/photo-1606414759315-51d7de3c6db9?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=320&w=640"></a>

英文色碼表數字色碼表

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

SCROLLBAR-FACE-COLOR: #CCCCCC 移動棒的顏色 SCROLLBAR-HIGHLIGHT-COLOR: #FFFFFF 按鈕邊框內層左邊與上面的顏色 SCROLLBAR-SHADOW-COLOR: #FFFFFF 按鈕邊框內層右邊與下面的顏色 SCROLLBAR-3DLIGHT-COLOR: #CCCCCC 按鈕邊框外層左邊與上面的顏色 SCROLLBAR-ARROW-COLOR: #FFFFFF 按鈕箭頭的顏色 SCROLLBAR-TRACK-COLOR: #CCCCCC 底部軌道顏色 SCROLLBAR-DARKSHADOW-COLOR: #CCCCCC 按鈕邊框外層右邊與下面的顏色

祝您使用愉快

玟玟不做教學，但最近好多新朋友在問語法問題，所以，我最近的文章多少會引用一些教學文章，但請各位格格，自行研究，如有問題，除了是我自己的教學分享外，其餘的請至我引用的網址，去問原創者，請不要再問我了。

以上的文章引用如有任何疑問，請直接去問部落格達人柏憲本人。