📌  相关文章
📜  如何在 CSS 中以相对于父元素的百分比设置背景图像的宽度和高度?

📅  最后修改于: 2021-08-30 10:19:58             🧑  作者: Mango

如果我们使用图像作为子元素并希望以百分比设置高度和宽度,那么我们需要将父元素设置为某个固定大小。

方法一:

  • 在这里,我们将在标签内使用 CSS,也称为内联 CSS
  • 对于父 div,我们将根据屏幕大小通过指定 height: 500pxwidth: 40%来给出固定大小,并且我们将为其提供背景颜色和边框以清楚地使父级可见。
  • 现在对于子图像,我们将给出宽度:60%高度:70%。
HTML


  

    
           GFG     
  


HTML


  

    

  

    
        GFG     
  


输出:

方法二:

  • 在这里,我们将编写 CSS in style 标签,也称为内联 CSS。
  • 现在我们将通过给它高度:500px宽度:40%来给父固定大小,为了清楚地定义父,我们将给出边框颜色和背景颜色。
  • 最后,我们将给图像width: 50%height: 45%

HTML



  

    

  

    
        GFG     
  

输出: