div之间的空间很小
[英]little space between divs
问题描述
I have another question on you. 
我还有一个问题要问你。 I decided to create something like web-fanpage of Mr.Robot. 我决定创建类似Mr.Robot的网页粉丝页面。 I have wanted to practice html and css + learn JS. 我想练习html和CSS +学习JS。 But there is a problem I cant solve. 但是有一个我无法解决的问题。 There is space between divs. div之间有空间。 I tried many tutorials how to remove it but none of them helped. 我尝试了许多教程，如何将其删除，但都没有帮助。
body { width: 100%; height: 100%; margin-left: 0px; margin-top: 0px; } #main { height: 100%; width: 100%; } header { background: black; padding: 1px; max-width: 100%; } header p { margin-left: 50px; font-family: 'Inconsolata', monospace; font-size: 50px; text-align: center; } .barva { color: #B20707; } .menu { height: 100%; width: 0; position: fixed; z-index: 1; top: 0; left: 0; background: black; overflow-x: hidden; transition: 0.5s; padding-top: 60px; } .menu a { display: block; text-decoration: none; color: white; font-size: 20px; padding: 8px; transition: 0.3s; margin-left: 20px; font-family: 'Poppins', sans-serif; } .menu a:hover { color: #B20707; } .Openbt { cursor: pointer; position:absolute; top: 0; left: 0; margin-top: 20px; margin-left: 10px; float:left; color: #B20707; font-size: 50px; } .menu .closebt { position: absolute; top: 0; right: 25px; font-size: 36px; margin-left: 50px; color: #B20707; } @media screen and (max-height: 450px) { .sidenav {padding-top: 15px;} .sidenav a {font-size: 18px;} } } .domu { height: auto; } img { max-width: 100%; } .about { height: auto; max-width: 100%; min-height: 250px; background: black; }
<!doctype html> <html lang="cs-cz"> <head> <link href="https://fonts.googleapis.com/css?family=Arimo" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Poppins" rel="stylesheet"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> <link rel="stylesheet" type="text/css" href="style.css"> <meta charset="utf-8"> <title>Yaaa boiii</title> </head> <body> <header> <p style="color:white "><span class="barva">ID:_ROOT:</span>Our<span class="barva">_democracy_</span>has<span class="barva">_</span><span class="barva">been</span>_hacked</p> <div class=Openbt> <span onclick="openNav()"><i class="fa fa-bars"></i></span> </div> </header> <div id="mySidemenu" class="menu"> <a href="javascript:void(0)" class="closebt" onclick="closeNav()">×</a> <a href="#">Home</a> <a href="#">Home</a> <a href="#">Home</a> <a href="#">Home</a> <a href="#">Home</a> </div> <div id="main"> <!-- Veškerý kontent --> <div class="domu"> <img src="obrazky/robot.jpg" width="1920" height="1000" /> </div> <div class="about"> </div> </div> <script> function openNav() { document.getElementById('mySidemenu').style.width = "250px"; document.getElementById('header').style.marginLeft = "250px"; document.getElementById("main").style.marginLeft = "250px"; } function closeNav() { document.getElementById('mySidemenu').style.width = "0px"; document.getElementById("main").style.marginLeft = "0px"; } </script> </body> </html>
Maybe you noticed that I had to set some width and height to the picture. 也许您注意到我必须为图片设置一些宽度和高度。 How do I set it height 100% and width 100%? 如何设置高度100％和宽度100％？ I tried to type it into .domu but it didnt work. 我试图将其键入.domu，但没有用。
1 个解决方案
解决方案1
3 已采纳 2017-09-28 23:52:00
Two solutions both involve changing your css; 两种解决方案都涉及更改CSS。
1) You can change your body background color to match the about background color. 1）您可以更改您的身体背景颜色以匹配大约背景颜色。 This can be done by adding the following to your css. 这可以通过将以下内容添加到CSS中来完成。
body
{
background: black;
}
2)You can use the display: block; 2）您可以使用display: block; style on your img tag. img标签上的样式。
<img src="obrazky/robot.jpg" width="1920" height="1000" style="display: block;"/>
Good luck 祝好运
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.