1、獲得自己喜歡“返回頂部”圖標,上傳覆蓋Discuz原圖標
①獲取自己喜歡的圖標,網上搜索一大堆,關鍵詞:返回頂部圖標素材
②“返回頂部”圖標所在目錄路徑:/static/image/common/scrolltop.png 然后將自己圖標上傳覆蓋,完成后進行下一步。
2、修改相關css參數,修改返回頂部圖標的尺寸
由于您的圖標不一定和原本圖標尺寸一致,所以覆蓋后,會顯示不全,所以要修改相關css參數,修改返回頂部圖標的尺寸。
返回頂部圖標css文件目錄路徑:/template/default/common/common.css
打開編輯找到代碼:#scrolltop { visibility: hidden; position: fixed; bottom: 100px; display: block; margin: -30px 0 0; width: 20px; height: 50px; background: url({IMGDIR}/scrolltop.png) no-repeat 50% 0; line-height: 999px; overflow: hidden; cursor: pointer; }
(打開css文件,直接搜索scrolltop,可以快速找到此段代碼)
其中width和height分別對應圖標的寬度和高度,例如:若圖標尺寸是20X50,那么代碼中的寬度和高度修改成:width: 20px;height: 50px;
修改完畢后,上傳覆蓋,修改返回頂部圖標成功!
更多信息請查看IT技術專欄