从网页背景中删除空白答案

【问题标题】：remove white space from web page background从网页背景中删除空白
【发布时间】：2019-10-22 12:06:52
【问题描述】：

我正在尝试从 html 页面的背景中删除空白，我已经使用了这段代码，但仍然面临同样的问题！

我正在使用 Angular 7 和节点 10 和 chrome 浏览器

HTML 文件...

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Document</title>
</head>
<body>
Hello World!
</body>
</html>

SCSS 文件...

$colors: (
  primary: #000000,
  fonts: #ffffff
);

body {
  background-color: map-get($colors,primary);
  color: map-get($colors, fonts );
  margin: 0;
  padding: 0;
}

【问题讨论】：

在浏览器开发工具中使用元素检查器。它会告诉你它来自哪里。
如果我没有写“hello world”，背景就不会出现：/！
您是否尝试过使用浏览器开发工具并检查过？
我把它放在 codepen 中，效果很好。我认为有些东西你没有分享。建议按照 lurker 所说的去做并查看元素检查器。只需右键单击 hello world 并选择检查。
我在 body 元素上看到了 8px 的边距，尽管我在我的 scss 中将它们设置为 0px ！

标签： html css angular web sass

【解决方案1】：

以前没有使用过 Angular，所以我不确定它是否会起作用。但我不认为它应该有所作为。

您要做的是重置浏览器。

默认设置为内容框，其中包括来自浏览器的填充和边距。使用通用选择器，将填充和边距设置为零。在 body 元素中将 box-sizing 属性设置为 border-box，然后让通用选择器继承 box-sizing 属性。

* {
  padding: 0;
  margin: 0;
  box-sizing: inherit;
}

body {
  box-sizing: border-box;
}

【讨论】：

【解决方案2】：

因为<body> 标签采用默认边距/填充，您得到了空白。因此，您只需在 CSS 中将其设为 0。

css -

body {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

它应该可以完成这项工作。

【讨论】：