简体   繁体   English

图像和div标签之间的差距

[英]Gap in between image and div tag

so I'm making a website in dreamworks cc and theres a big gap in between my image and a div tag. 所以我在dreamworks cc中建立了一个网站,我的图像和div标签之间存在很大差距。 See picture: 见图:

http://i.imm.io/1gzKW.png http://i.imm.io/1gzKW.png

Okay now heres my index code: 好的,现在是我的索引代码:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Home</title>
<link href="style/style.css" rel="stylesheet" type="text/css">
</head>

<body>
<div class="container" style="">
  <div class="logo"><img src="images/header.png" width="990" height="256"  alt=""/></div>
  <div class="menu">
    <div class="menubutt1" style="cursor:pointer;" onclick="location.href='./index.html'">Home</div>
    <div class="menubutt2" style="cursor:pointer;" onclick="location.href='./aboutus.html'">About Us</div>
    <div class="menubutt3" style="cursor:pointer;" onclick="location.href='./games.html'">Game Info</div>
    <div class="menubutt4" style="cursor:pointer;" onclick="location.href='./forms.html'">Forms</div>
    <div class="menubutt5" style="cursor:pointer;" onclick="location.href='./gallery.html'">Gallery</div>
    <div class="menubutt6" style="cursor:pointer;" onclick="location.href='./contactus.html'">Contact Us</div>
  </div>

  <div class="content">stuff</div>
  <div class="footer"><br><strong>©</strong>2013 Trey Zanone</div>
</div>


</body>
</html>

and heres my css style sheet: 并且我的css样式表:

@charset "utf-8";.container {
    background-image: none;
    width: 990px;
    margin-right: auto;
    -webkit-transition: all;
    -moz-transition: all;
    -ms-transition: all;
    -o-transition: all;
    transition: all;
    margin-left: auto;
    padding: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
}
.content {
    width: 990px;
    margin-right: auto;
    margin-left: auto;
    padding: 30px;
    background-image: url(../images/body.png);
    background-repeat: repeat-y;
    margin-top: 0px;
    margin-bottom: 0px;
}
.footer {
    background-image: url(../images/footer.png);
    width: 990px;
    height: 100px;
    text-align: center;
    margin: 0px;
    padding: 0px;
}
body {
    background-image: url(../images/background.png);
    background-repeat: repeat-x;
    margin-top: 0px;
}
img {
    border:0;
    margin:0
}
.logo {
    background-image: none;
    padding: 0px;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
}
.menu {
    height: 48px;
    width: 934px;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
}

I took out the menu button rules, as it is long and irrelevant. 我拿出了菜单按钮规则,因为它很长且无关紧要。

In Your <img> : 在你的<img>

img {
    border: 0;
    margin: 0;
    display: block;
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM