Question

我在这个网站上搜索并搜索了一个解决方案，并尝试将所有结果应用于我的简单HTML，但似乎没有任何效果。

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

我想要一个简单的布局，3 div s。一个主页div包含两个水平div，我希望div内的两个包含将用作主页中包含的div背景的图片div，我可以获得背景，但无法摆脱白线的页面，我确定你们都厌倦了阅读。

我得到了＆＃34; header＆＃34;和＆＃34; site＆＃34; div秒。我确定这是一个简单的解决方案。

我想让HTML保持尽可能简单，并且只计划有3个三个链接，一旦空间消失，我将放入，因为我确信我可以将解决方案应用于{{1 }}第

我也在努力上传代码，请提供建议

HTML：

div

CSS：

<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>

非常感谢有人发布解决方案。

Answer 1

由于容器的字体大小，您遇到此问题。将容器的line-height和font-size设置为0，空格将消失。

如果它仍然没有修复它，请从HTML中删除任何空格（包括制表符或换行符），这样代码块会相互接触，如下所示：

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

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

Answer 2

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

但是，我认为这有助于解决您的问题。我发现在CSS文件中包含CSS重置总是一个好主意。这样就可以摆脱所有那些不需要的空间，边距以及其他难以使用的东西。

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

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

Answer 3

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

 {overflow: hidden;}

适合我。

Answer 4

像Brice Said先生一样，您需要设置较小的行高，以便将小尺寸固定到页面源代码的div中，但要注意如果在一般Body的CSS中行高是不同，例如：

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

如果您的div需要不同的行高，并且字体大小需要website的某些特定部分，则需要设置一个类，然后链接：

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

Answer 5

如果你想让你的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;}

div之间的空格，简单的HTML

5 个答案: