發(fā)現(xiàn)好多家的淘寶店鋪裝修的很大氣,其中之一亮點(diǎn)就是他們固定了頁面的背景,無論怎么往下拉頁面,背景都不會(huì)動(dòng)。裝修宅介紹一個(gè)簡單易懂的淘寶背景固定代碼教程,方便各位店長設(shè)置淘寶背景圖片固定代碼。
代碼如下:
body{background-image:url(http://img01.taobaocdn.com/imgextra/i1/911543064/T2MTMYXdBXXXXXXXXX_!!911543064.jpg);background-repeat:no-repeat;background-position:top center;background-attachment:fixed;}
需將上面的紅色提示文字“ http://img01.taobaocdn.com/imgextra/i1/911543064/T2MTMYXdBXXXXXXXXX_!!911543064.jpg ”替換修改實(shí)際的淘寶背景固定圖片的地址。必須上傳到淘寶官方圖片空間,裝修宅分享的這個(gè)淘寶背景固定代碼,是其中一個(gè)天貓店鋪的背景圖,需搬家后才能顯示出來。
現(xiàn)在對(duì)這段樣式講解一下:
body 是整個(gè)頁面的基本元素,也是最外面的的一個(gè)HTML標(biāo)簽;
background 是背景樣式,其中url里面的是背景圖片地址,no-repeat 代表圖片不平鋪(如果是基礎(chǔ)版店鋪,是repeat,注意修改代碼),center 代表圖片居中;
background-attachment 是最關(guān)鍵的,規(guī)定背景圖片是固定還是滾動(dòng),這里我們?cè)O(shè)置的當(dāng)頁面的其余部分滾動(dòng)時(shí),背景圖像不會(huì)移動(dòng);
代碼安裝步驟:
1、制作淘寶店鋪固定背景圖片。一般背景圖片是1920px寬的,如果是集市店即C店,中間是留白950px寬,而天貓店鋪是中間留白990-1000px寬的。裝修宅上面代碼的背景圖片是天貓店鋪的,中間留白是1000px寬??梢阅孟旅娴膱D片作為參考,使用PS制作自己店鋪的固定背景圖。做好之后上存到自己店鋪的圖片空間。
天貓背景圖參考:http://img02.taobaocdn.com/imgextra/i2/911543064/T27HTMXhNbXXXXXXXX_!!911543064.jpg
C店背景圖參考:http://img01.taobaocdn.com/imgextra/i1/198804649/T2Ha41XCpaXXXXXXXX-198804649.jpg
2、然后到自己的店鋪首頁去裝修>點(diǎn)選裝修>導(dǎo)航裝修>點(diǎn)顯示設(shè)置>輸入下面一段代碼(可以復(fù)制拷貝進(jìn)去):
body{background-image:url(http://img02.taobaocdn.com/imgextra/i2/911543064/T27HTMXhNbXXXXXXXX_!!911543064.jpg);background-repeat:no-repeat;background-position:top center;background-attachment:fixed;} |
紅色段為固定背景圖片的絕對(duì)地址,替換成你的背景圖片地址。然后確定保存,即可顯示。
3.請(qǐng)一定要把樣式里的背景、背景色去掉,否則無效。(如下)請(qǐng)?jiān)O(shè)置一下,旺鋪背景,背景色不要打勾,頁面背景圖要?jiǎng)h除然后保存下就可以了。
如果代碼不會(huì)替換圖片代碼的,可以使用裝修宅提供的淘寶店鋪固定背景代碼在線生成工具
查看更多相似文章