淘寶店鋪導航CSS程式碼使用修改技巧

詳解淘寶店鋪導航CSS程式碼使用修改技巧

操作方法

（01）首先我們進入到店鋪的裝修頁面，將滑鼠放在導航上面會出現“編輯”字樣，單擊，選擇“顯示設定”選項卡

（02）1.修改導航分類下面的背景色，程式碼如下：-box-bd {background:#000000;}效果如下

（03）如果你想要更加個性，而不想只要簡單的純色塊的話，可以自己做圖片，然後連線上去，程式碼如下：-box-bd .link{background:url(http://img03.taobaocdn.com/imgextra/i3/682206429/T210IOXCdXXXXXXXXX_!!682206429.jpg);}將“圖片連線”換成你的圖片的連線就可以了，一般都是自己做好然後上傳到淘寶圖片空間，然後連結就可以了！在圖片空間點選對應圖片下方的“連結”按鈕可以直接複製圖片連結，替換到程式碼裡就可以了！

（04）導航背景色程式碼（除去“所有分類”）如下：-list {background:#000000;}

（05）導航欄文字（除去“所有分類”）如下：-list e{color:#顏色程式碼;font-size:字號px;}

（06）“所有分類”的背景色程式碼如下：-cats {background:#000000;}

（07）“所有分類”的文字程式碼如下：-cats e{color:#顏色程式碼;font-size:字號px;}

（08）二級分類文字程式碼如下：p-content -tree -cat -name{font-size:字號px;color:#顏色程式碼;font-weight:bold/bolder/normal;}

（09）二級分類背景程式碼如下：p-content{background:#000000;}

（10）三級分類文字程式碼（除去“所有寶貝”分類）如下p-content -tree -pop-inner{font-size:字號px;color:#顏色程式碼;font-weight:bold/bolder/normal;}

（11）一級導航分類（除去“所有寶貝”分類）分隔線顏色程式碼如下：-list {border-color:#FFFFFF;}

（12）滑鼠滑過一級分類導航文字變換背景色程式碼如下：-list -hover {background:#000000;}

（13）滑鼠滑過一級分類導航文字變換顏色程式碼如下：-list -hover e{color:#FFFFFF;}

特別提示

注意顏色程式碼的提取，可以用ps等工具選擇你喜歡的顏色

製作圖片連結時，注意圖片的大小