使用框架(無論是frameset、frame、iframe)嵌套網頁的時候,如果子網頁的高度超過了預先設定的高度,會出現(xiàn)滾動條,也就是尺寸溢出,一般來說如果高度超了就出現(xiàn)垂直滾動條,寬度超了就出現(xiàn)水平滾動條,但是在IE6中,只要尺寸大于等于預定高度,就會兩個滾動條一起出現(xiàn),這好象是一個bug。
解決方法:
在子網頁設置css如下:
html {
overflow-y:auto!important;
*overflow-y:scroll;
}
這段最重要的一點是設置overflow-y為scroll,這樣強制出現(xiàn)垂直滾動條的話,水平滾動條就不會顯示出來了,但如果寬度超出過多,水平滾動條還是會超出,這時可以考慮設置:overflow-x:hidden;,但相應的,這樣用戶就無法滾動子頁面了。
之所以要加overflow-y:auto!important;,是因為IE7中已沒有這個bug,并且firefox也能認到overflow-y這個據(jù)說是IE的私有屬性……,所以我們還要把overflow設回來。
主頁面加IFRAME SCROLLING="YES"
子頁面
程序代碼
'讓豎條消失:
<BODY STYLE='OVERFLOW:SCROLL;OVERFLOW-Y:HIDDEN'>
</BODY>
'讓橫條消失:
<BODY STYLE='OVERFLOW:SCROLL;OVERFLOW-X:HIDDEN'>
</BODY>
'還要去掉
'子頁面里的
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
'兩個都去掉
<IFRAME scrolling="no">
-----------------------------------------------------------------------------------------------------------
使用dw生成的頁面會有下面兩句:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
如果帶有這兩句的頁面被嵌入到iframe里面,那么overflow-x : hidden ;就不起作用。
-----------------------------------------------------------------------------------------------------------
框架代碼:
<frameset rows="100,*" cols="*" frameborder="no" border="0" framespacing="0">
<frame src="index.php?cp=top" name="topFrame" scrolling="No" noresize="noresize" id="topFrame" />
<frameset cols="200,*" frameborder="no" border="0" framespacing="0">
<frame src="index.php?cp=left" name="leftFrame" scrolling="yes" noresize="noresize" id="leftFrame" />
<frame src="main.php" name="mainFrame" id="mainFrame" />
</frameset>
</frameset>
使用上面的框架時當我們的main.php內容超多屏幕時,橫向和豎向都會出現(xiàn)滾動條,對于橫向我們的main.php的寬度無論有沒有超過mainFrame的寬度都會出現(xiàn)橫向滾動條,為了取消橫向滾動條我們采用了以下方法:
前提條件是:mainFrame的頁面沒有聲明DTD,即
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
body {
overflow: scroll;
overflow-x: hidden;
overflow-x: auto !important;
}
如果聲明了DTD,可以把body換成html解決。