Question

我有左框架和右框架。出于某种原因，我的框架右侧边缘很小。

我认为原因是因为我的右框架宽度为29％而左框架的边距为70％。给它总共％99。但出于某种原因，当我将右框架设置为30％时，它位于右框架下方。

任何人都可以帮助我，以便正确的框架将占用整个屏幕尺寸而不会出现任何损失

谢谢!!!

下面是我的HTML代码和实际网站的链接（请不要这只是我想要实现的另一个项目的骨架模型。

http://15c04752.ngrok.com/sandbox/frames/

    <!DOCTYPE html>
<html>
<head>
    <title></title>

<style>

    body,html{
        margin: 0px;
        padding: 0px;
        height: 100%;
        overflow: hidden;

    }
    iframe{

        height: 100%;
        padding: 0;
        margin: 0;
    }

    .left{
        border: 0;
        padding: 0;
    }

    .right {
        border: 0;
        padding: 0;
    }


</style>


</head>
<body>



<iframe class="left" width="70%" src="left_frame.html"></iframe>

<iframe class="right" src="right_frame.html"  width="29%" name="right_frame"></iframe>


</body>
</html>

Answer 1

问题的原因是两帧之间的空白区域。

有很多方法可以删除它，注释掉空格是一个快速的方法：

<iframe width="70%"></iframe><!--
--><iframe width="30%"></iframe>

或（注意第一个>的结尾frame如何在下一行）

<iframe width="70%"></iframe
><iframe width="30%"></iframe>

OR（通过将元素紧接在一起后删除空白区域）

<iframe width="70%"></iframe><iframe width="30%"></iframe>

如果元素是一个选项，则浮动元素，因为浮动元素会将它们从父元素的正常高度计算中取出。

<iframe width="70%"></iframe>
<iframe width="30%"></iframe>

CSS：

iframe {float:left;}

OR 将font-size的父级body设置为0，然后再将其重新设置为子级所需的值

为什么右边框架旁边有一个右边距？

1 个答案: