css前端背景图片不显示，background-image无效，路径正确但背景图片不显示问题

记录一次调试前端页面时设置背景图片不生效问题：

一、路径问题：

        老规矩根据网上资料检查路径是否正确，相对路径绝对路径都试过均不生效

<div class="container" style="background-image: url(./img/bg.png)">
    </div>复制

.container{
  width: 100%;
  height: 100%;
}复制

二、高度问题：

        后面又想到如果div盒子没有高度，背景图片是显示不出来的，虽然设置了高度100%，但是如果内部没有元素撑开依然没有效果，所以把高度宽度都加上

.container{
  width: 100px;
  height: 100px;
}复制

        结果发现还是没有效果，依然显示不出来，有点头疼了

三、最终解决：

        后面想到是不是路径解析不对，如果把属性放在style中是不是更好

    <div class="container">
    </div>复制

.container{
  width: 100px;
  height: 100px;
  background-image: url(./img/bg.png)
}复制

问题完美解决，背景图片正常显示了，但是不知道具体原理，记录下来希望有大佬解惑