English 中文(简体)
CSS and Iframe. 如何在座右上看一整页,而不在座机上加一。
原标题:CSS and Iframe. How to view the full page without scroll in the Iframe?

我试图与安保部一道开发一个 La子,使用一机。 我怎么能够不滚动地在座标上显示全页? 是否适合显示完整的网页?

该守则是:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>layout basic method web</title>
    <style type="text/css" media="screen">
        #container
        {
        width: 100%;
        height: 100%;
        background-color: #fff;
        }

        iframe
        {
        border-style: none;
        width: 100%; 
        height: 100%;
        }
    </style>
</head>
<body>
    <div id="container">
        <div id="top">
            <h1>Header</h1>
        </div>
        <div id="content">
            <h2>Subheading</h2>
            <IFRAME name= iframe1  id="iframe1" src="http://www.yahoo.com"></IFRAME>
        </div>
        <div id="footer">
            Footer
        </div>
    </div>
</body>
</html>

如果你测试该守则,你就会看到,安全局在网页上设置了一个滚动。 我怎么能够rid开这一滚动,显示所有页子?

最佳方面,


最新资料:

I m almost there. I only need that the scroll up/down goes over the Header, just like goes over the footer. Is that possible? Please see the code. Just copy/paste it.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title> stu nicholls | CSS PLaY | cross browser fixed header/footer layout basic method </title>
<style type="text/css" media="screen">
    #printhead {display:none;}

    html {
        height:100%; 
        max-height:100%; 
        padding:0; 
        margin:0; 
        border:0; 
        background:#fff; 
        font-size:80%; 
        font-family: "trebuchet ms", tahoma, verdana, arial, sans-serif;
        /* hide overflow:hidden from IE5/Mac */ 
        /* */ 
        /*overflow: hidden;*/ 
        /* */ 
    }

    body {height:100%; max-height:100%; overflow:hidden; padding:0; margin:0; border:0;}

    #content {display:block; height:100%; max-height:100%; overflow:hidden; padding-left:0px; position:relative; z-index:3; word-wrap:break-word;}

    /*#head {position:absolute; margin:0; top:0; right:18px; display:block; width:100%; height:50px; background:#fff; font-size:1em; z-index:5; color:#000; border-bottom:1px solid #000; }*/

    #head {position:absolute; margin:0; top:0; right:18px; display:block; width:100%; height:50px; background:#fff; color:#000; font-size:1em; border-bottom:1px solid #000;}

    #foot {position:absolute; margin:0; bottom:-1px; right:18px; display:block; width:100%; height:25px; background:#fff; color:#000; text-align:right; font-size:2em; z-index:4; border-top:1px solid #000;}

    .pad1 {display:block; width:18px; height:50px; float:left;}

    .pad2 {display:block; height:50px;}

    .pad3 {display:block; height:500px;}

    #content p {padding:5px;}

    .bold {font-size:1.2em; font-weight:bold;}

    .red {color:#c00; margin-left:5px; font-family:"trebuchet ms", "trebuchet", "verdana", sans-serif;}

    h2 {margin-left:5px;}

    h3 {margin-left:5px;}
</style>
</head>
<body>
<div id="head">
    <div class="pad1"></div><h1>Header</h1>
</div>
<div id="content">
<div class="pad2"></div>
    <IFRAME name="teste" src="http://www.yahoo.com" width="100%" height="100%" frameborder=0></IFRAME>
<!--<div class="pad3"></div>-->
</div>
<div id="foot">Footer</div>
</body>
</html>

如何做到这一点,有何影响?

最佳方面,

问题回答

你们不得不确定顶端的高度,以达到你所研究的顶峰。

如果该网页属于同一领域,那么你可以使用java字母来动态地调整其范围,使之与你所看到的页体大小相匹配。 在那里,有一些 j花 p,将这样做。

如果是外部领域,你就不得不这样做,那么,你就不得不把地板的高度财产确定下来。

如果你想在主窗子上清除滚动锁,添加一个<代码>overflow。 风格:

#container {
    width: 100%;
    height: 100%;
    background-color: #fff;
    overflow: hidden;
}

你们可以用 j子这样做:

   function resizeFrame(){
    var iframe = parent.document.getElementById( id of your iframe );  
    $(iframe).height($( #your top html tag inside your iframe ).height());
    $(iframe).width($( #your top html tag inside your iframe ).width());
   }

Then call this function on load & after any hide/unhide actions that will change the form length: resizeFrame();

如果在座标内有顶级(html)的帽子,你可能需要在高端/宽度上添加 p,如:

    $(iframe).height($( #your top html tag inside your iframe ).height()+40);
    $(iframe).width($( #your top html tag inside your iframe ).width()+20);

单机不能根据显示的页数调整尺寸。 你们需要用javascript来调整其规模,这意味着你事先知道该页的大小。 如果你在显示你内部另一页的内容之后,确实会看一线。

A very simple example can be found here: http://aleembawany.com/2005/09/01/ajax-instant-tutorial

知道,由于浏览器的安全环境,在交叉主线上加亚x的装货页可能不会奏效。





相关问题
CSS working only in Firefox

I am trying to create a search text-field like on the Apple website. The HTML looks like this: <div class="frm-search"> <div> <input class="btn" type="image" src="http://www....

image changed but appears the same in browser

I m writing a php script to crop an image. The script overwrites the old image with the new one, but when I reload the page (which is supposed to pickup the new image) I still see the old one. ...

Firefox background image horizontal centering oddity

I am building some basic HTML code for a CMS. One of the page-related options in the CMS is "background image" and "stretch page width / height to background image width / height." so that with large ...

Separator line in ASP.NET

I d like to add a simple separator line in an aspx web form. Does anyone know how? It sounds easy enough, but still I can t manage to find how to do it.. 10x!

热门标签