HTML背景图像适合整个页面+；img src已损坏

好的，我是angular的新手，我有一个项目要做，我试着把这4个按钮和一个背景图片放在整个页面上。我把按钮放在一张桌子上，以帮助我安排它，但出于某种原因，背景图像只适合这些按钮后面=桌子

此外，每当我试图从我的计算机加载一个图像时，我都会得到损坏的图像错误。图片位置与HTML代码相同

还有一件事，有没有快速排列按钮、图像等的方法

提前感谢：）

A.
B
C
D

结果是这样的

---

我希望背景也能填充白色区域…

只需为背景添加css规则，如：

正文{
背景：白色url（“http://lorempixel.com/1600/900）无重复固定中心；
}

对于您的按钮，您可以让它们在预定义的容器内自然流动，或者在容器内使用绝对定位，宽度百分比宽度/高度值

---

乐：如果你想让你的CSS内联，只需将主体CSS规则放在一个“样式”属性中。i、 e.

要将背景图像应用于整个页面，以下是一个很好的示例：

---

最后两个过滤器是用于IE的。

只需使用类似CSS的CSS添加背景即可

body{
background-image: : url("path");
background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* This will make image fit according to body size*/
}

---

请确保使用了正确的映像路径，或者可以在调试器的“网络”选项卡上检查映像是否正在加载

请检查映像文件路径。您在图像路径中使用了\而不是/。这就是你的形象受损的原因。您的路径应如下所示：

<img src="images/photo.jpg" alt="aaa"> 

试试看。这将运行良好

您想在哪里设置背景图像？对整个身体还是只对桌子的背景？因为在上面的代码中，您希望将bg image设置为body，并且根据代码的屏幕截图，您已经将image设置为id为bg的div

请为我们提供正确的代码，以便我们找到更好的解决方案。

---

谢谢。

您可以根据需要使用以下CSS代码

body, html {
  height: 100%;
}

.bg {
  /* The image used */
  background-image: url("img_girl.jpg");

  /* Full height */
  height: 100%;

  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

---

提示：正文将适合don（您的表格）所占用的空间，而不是一英寸。提示2：用于布局的表格来自1990年。改用女主角！您的HTML无效。提示3：正如答案所示，使用css来设置样式，而不是内联样式属性。它有助于可读性和代码维护这是否回答了您的问题？我试过了，但是当我试着从我的电脑上放一张照片时，它不起作用，但是它可以通过url从互联网上放一张照片。。。然后检查图像的url

<img src="images/photo.jpg" alt="aaa"> 

body, html {
  height: 100%;
}

.bg {
  /* The image used */
  background-image: url("img_girl.jpg");

  /* Full height */
  height: 100%;

  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}