去除图像两侧和中间的间距

问题描述 投票:0回答:2

我需要这些图像来填满整个屏幕。目前,整个页面周围以及图像之间都有一个空白区域。

<!DOCTYPE html>
<html>
<head>

<title>TITLE</title>
</head>

<style>
html, body {
    max-width: 100%;
}
</style>

<body>
<style>
.staticsite
left: 0%;
font-size: 0;
line-height: 0;
}

div {
    width: 100%;
}
</style>

<div style="staticsite">
<a href="URL" style="text-decoration: none">
    <img class="staticsite" img draggable="false" src="IMGURL" width="100%" alt=""> </a>
<img class="staticsite" img draggable="false" src="IMGURL" width="100%" alt="">
</div>

</body>
</html>

我已经尝试将它们放入填充屏幕的DIV中,我不太清楚为什么这不起作用。我刚刚将所有代码放在上面,因为这是整个页面。

html css image
2个回答
2
投票

body {
  margin: 0;
}

img {
  display: block;
  width: 100%;
}
<a href="#">
  <img src="//via.placeholder.com/300x50" alt="">
</a>
<img src="//via.placeholder.com/300x50" alt="">

1
投票

我添加了一些额外的样式来解决您的问题。身体上的边缘将阻止白色边框,而块显示将处理图像之间的空白区域。

<html>
<head>
<style>
body {
    margin: 0;
}

img {
    max-width: 100%;
    margin:0;
    padding:0;
    width:100%;
    height:auto;
    display:block;
}
</style>

<body>
<div>
	<img src="https://img-9gag-fun.9cache.com/photo/azq0grm_460s.jpg" />
	<img src="https://img-9gag-fun.9cache.com/photo/azq0grm_460s.jpg" />
</div>
</body>
</html>

编辑:基本上与其他人的答案相同,但稍后。

© www.soinside.com 2019 - 2024. All rights reserved.