去除 html/css 中图片的边距答案

【问题标题】：Removing the margin on a picture in html/css去除 html/css 中图片的边距
【发布时间】：2020-08-14 15:30:09
【问题描述】：

What the page currently looks like and the margin I want to remove

我想删除图像周围的白色边框。我尝试了很多东西，似乎没有任何效果。这是我到目前为止所拥有的。 HTML：

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>repl.it</title>
    <link href="home.css" rel="stylesheet" type="text/css" />
</head>

<body style="background-color:white;">
    <img src="Banner1.jpg" width=100% height=200px>
  <div >
       <center> <a href="about.html"> About </a> 
        <a href="MyFeed.html">My Feed</a></center>
    <script src="home.js"></script>
  </body>
</html>

在 CSS 中

.col{ float: left;
        background-color: #0f83c775;
        height:3px;
        width:33%;
        position:"fixed";
         overflow:auto;}
.body{max-width: 100%;
    margin: 0;
            padding:0;
}
.img{max-width: 100%;
    margin: 0;
            padding:0;
                margin-left: 0px;
    margin-right: 0px;

}

【问题讨论】：

body {，而不是.body {。

标签： html css margin repl.it

【解决方案1】：

你只放了一个 .在 img 和 body 之前，您可以定义 img 和 body 元素，而不是 img 和 body 类。

这是您更正后的 css：

.col{ float: left;
        background-color: #0f83c775;
        height:3px;
        width:33%;
        position:"fixed";
         overflow:auto;}
body{
    margin: 0;
    padding:0;
}
img{
    width: 100%;
    margin: 0;
    padding:0;
}

只使用宽度而不是 max-width 并且不要将宽度属性添加到 body

<meta name="viewport" content="width=device-width">

你的头部会让身体占据屏幕的宽度

但我不明白你想用 .col 定义什么，如果它是指向 myfeed.html 而不是 .col{ 的链接，你应该放一个{

希望对你有帮助

【讨论】：

非常感谢！这真的很有帮助。