0

我已经在此站点上搜索并搜索了解决方案，并尝试将所有结果也应用到我的简单 HTML 中，但似乎都没有工作。

我确信有一种非常简单的方法可以做到这一点，因为目前没有任何代码可以解释。

我想要一个简单的布局，3 divs。一个 Main Pagediv包含两个水平divs，我希望两个 insidediv包含一张图片，该图片将用作divMain Page 中包含的背景div，我可以获取背景但无法消除页面的白线，我我相信你们已经厌倦了阅读。

我得到“ header”和“ site”之间出现的线div。我确信这是一个简单的解决方案。

我想保持 HTML 尽可能简单，并且只计划在空间消失后放置 3 个三个链接，因为我确信我可以将解决方案应用于更多divs。

我也在努力上传代码，请指教

HTML：

<html>
    <head>
        <link rel="stylesheet" type="text/css" href="css.css">
    </head>
    <body>
        <div id="mainwrap">
            <div id="header">
            </div>
            <div id="site">
            </div>
        </div>
    </body>
</html>

CSS：

#header{
    width:1080px;
    margin:0;
    height:285;
    background: url(header.jpg);
    float:left; 
}

#site{
    width:1080px;
    margin:0;
    height:480;
    float:left;
    background: url(main.jpg);   
}

#mainwrap{
    width:1280px;
    height:750px;
    margin:auto;
    background-color:#FFFFCC;
}

非常感谢，如果有人可以发布解决方案。

4

5 回答 5

1

由于容器的字体大小，您遇到了这个问题。将容器的line-heightand设置为，空间将消失。font-size0

如果仍然无法修复，请从 HTML 中删除所有空格（包括制表符或换行符），以便代码块相互接触，如下所示：

</div><div>
//   ^^ no space here

但是，请记住字体样式声明将向下级联到容器的子项中，因此请确保在其中将font-sizeand设置line-height为正常。

于 2013-08-19T23:20:49.157 回答
1

添加到css文件中的每个元素

 {overflow: hidden;}

为我工作。

于 2015-01-11T02:10:54.337 回答
1

我尝试将您的代码输入到 jsFiddle，但我无法重现您所看到的相同结果（使用白线）。可能只是我的浏览器...

但是，我认为这将有助于解决您的问题。我发现在你的 CSS 文件中包含一个 CSS Reset 总是一个好主意。这消除了所有那些不需要的空间、边距和其他以后很难处理的东西。

尝试从该站点添加 CSS：http: //meyerweb.com/eric/tools/css/reset/

或者只是谷歌“CSS Reset”并使用任何 CSS 示例。您可以将 CSS 添加到现有的 CSS...重置只是确保所有边距、填充等都设置为零。

于 2013-08-19T23:24:59.653 回答
0

就像 Brice 先生说的那样，您需要尽可能设置较小的 line-height 以将小尺寸固定到您页面源代码的 div 中，但请注意在您的一般 Body 的 CSS 中 line-height 是否不同，例如这个例子：

body{
    margin:0px;
    padding:0px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:12px;
    color:#545454;
    line-height:18px;
}

如果您的 div 需要不同的 line-height 和 font-size 到网站的某些特定部分，您需要设置一个类，然后链接：

#mainwrap{
   width:1280px;
   height:750px;
   margin:auto;
   background-color:#FFFFCC;
   line-height:18px;
}
于 2013-08-19T23:37:03.840 回答
0

如果您希望 div 之间的界限消失，您只需在 CSS 中添加一行代码。这行代码是BORDER我相信 1 到 3 像素的边框就可以了。

#header{border:1px;}

您也可以以相同的方式更改边框的颜色：

#header{border-color:#ffffff;}

例如：

HTML

<html>
<head>
    <link rel="stylesheet" type="text/css" href="css.css">
</head>
<body>
    <div id="mainwrap">
        <div id="header">
        </div>
        <div id="site">
        </div>
    </div>
</body>

CSS

#header{    

border:1px;    

width:1080px;
margin:0;
height:285;`enter code here`
background: url(header.jpg);
float:left;} 

#site{

border:1px;

width:1080px;
margin:0;
height:480;
float:left;
background: url(main.jpg);   }

#mainwrap{

border:1px;

width:1280px;
height:750px;
margin:auto;
background-color:#FFFFCC;}
于 2016-05-11T22:42:26.257 回答