Question

在过去的两周里，我设法从零开始学习html和CSS。我曾经在桌子和花车上度过了黑暗的时刻，但到目前为止，我始终能够自己解决问题。

我无法使CSS背景/背景图像规则正常工作，如下所示：

    <div class="mao"></div>

    .mao {
  background: url("mao.png");
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center;

我尝试在背景和背景图片之间切换。我尝试将文件移动到单独的img文件夹中。我尝试过各种规则组合，但从未显示过。实际上，我尝试使用的任何其他图像也没有。

有什么想法吗？

Answer 1

尝试在div标签（或任何内容）中添加一些文本，或为其设置宽度和高度，因为除非填充了某些东西，否则它将不会显示背景（或显示在屏幕中）

Answer 2

如果希望背景图像不显示任何文本，则需要在类属性中设置高度。

<style>
    .mao{
        background: url("mao.jpg");
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
        height: 300px; /*or whatever height you want*/
        }
</style>

然后：

<div class="mao"></>

Answer 3

您可以查看here有关CSS的背景属性的详细信息

始终在CSS背景图片上失败

3 个答案: