如何在 CSS 中使用 ::before 伪选择器放置背景图像？

给定一个网页，任务是使用::before伪选择器将背景图像放置在网页上。

::before伪选择器用于在所选项目的内容之前放置一些东西。

句法：

.container::before{
    content: '';
    background: url(image file);
    position:absolute;
    top:0px;
    left:0px;
}

方法：::before伪选择器将背景图像放置在被选元素之前，如果被选元素具有与之关联的背景颜色，我们可以使用z-index属性使背景图像可见。

例子：

HTML

  

    
    
          
    
  
    

  

    

        GeeksforGeeks


        How to place background image using
        ::before pseudo selectors ?
    

  

输出：

图片参考： https://media.geeksforgeeks.org/wp-content/cdn-uploads/20200212230557/How-To-Become-A-Web-Developer-in-2020-A-Complete-Guide.png