div嵌套div 背景圖片 不顯示的問題


這幾天 在做一個小Demo的時候碰到了如上的問題,一個DIV嵌套多個DIV時,父容器DIV不顯示背景圖片。同時結合之前碰到類似的問題,我歸納了如下幾個解決方法:

 1.就是常見的 子div 背景把父div的背景給蓋住了,例子:

 該例子就是 我有一個父div 和它里面嵌套的一個子div,兩個div的寬度和高度大小是一樣的,其中父div的背景圖片就是上面這張圖片(箭頭部分是透明的),子div的背景圖片是那種漸變灰色圖片,其實懂英語的人應該看出來了就是,我想實現一個那種類似於iphone滑動那種燈光從 左到右的滑動效果。所以方法就是通過JS控制子div 周期的 從左到右滑動。但我們加上去,子div會蓋住父div ,解決方法就是在他們兩個div樣式里 設置 z-index屬性的值,父 div 的值大於 子 div 的值就可以了。值越大 與靠近 屏幕,也就是我們最先看見的部分。當然z-index生效的前提是

div的position屬性值為absolute、relative或fixed。。。這點很重要。

2
.碰到的碰到的就是 IE6下 div 不顯示背景圖或者圖片的問題
這個最切記的就是 你的url路徑是否有名稱 是中文的 文件夾 或者 圖片名稱是 中文的。因為ie6是不支持的。

3.忘記給div的高度或者寬度 賦值了,因為 div是個容器 必須指定它的高寬,切高寬要足夠。


4.也是常見的錯誤,就是css中 background路勁問題:通常我將用於CSS效果的圖片放置在+Css
                            |
                            |+images
                            |-XX.css
因為BACKGROUND的url是相對css文件的路徑,不是相對html的路徑;
這樣寫:
   BACKGROUND: url(Images/DivTitle.gif);
就可以顯示,也就不用考慮其它的路徑的問題,也便於管理



免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM