我們常常在IE6版本的浏覽器查看一個網頁顯示完整,而在其他浏覽器上內容顯示不完整,這是為什麼呢,請看本文的詳細介紹。
DIV+CSS網頁的內容顯示不完整的診斷
我們常常在IE6版本的浏覽器查看一個網頁顯示完整,而在IE7及以上版本浏覽器、火狐等浏覽器上內容顯示不完整-DIV+CSS網頁內容顯示不完整診斷教程。
樣式截圖如下:
說明:最後一排的內容文字只顯示了一半。
◆分析造成原因:
1、CSS中設置了高度
2、設置了CSS樣式表屬性overflow:hidden,隱藏超出指定寬度、高度的對象-CSS隱藏。
◆解決方法:
1、CSS中設置了高度
取消其對象的高度(height)CSS樣式,即可兼容各浏覽器,內容也會顯示完整。如果取消了高度讓網頁布局左右內容板塊邊框不對齊,你可以不取消高度,但是你需要減少內容,將顯示不完整的內容去掉。
2、設置了CSS樣式表屬性overflow:hidden,隱藏超出指定寬度、高度的對象。
一般設置高度同時設overflow:hidden樣式,會造成在IE6中也讓內容顯示不完整。解決辦法如第一點,如果你不取消高度寬度限制條件下,你可以減少內容。
◆為什麼在IE6中設置了高度也能顯示完整,而在其它浏覽器中卻顯示不完整?
答:因為IE6內核的原因,你設置了高度,但你內容超出設置高度,他將自然的撐破你設置的高度寬度,而在IE7、IE8、火狐等浏覽器中將不能撐破設置的高度。
當然如果你想你設置的內容再多也不撐破你設置的高度寬度(包括IE6中),你可以在設置高度和寬度同時再設置overflow:hidden屬性樣式,這樣在IE6中也不會撐破你設置高度和寬度。你可以了解更詳細隱藏內容方法。