css 背景图片显示问题，设置height:100%后无作用

问题描述

问 题

想让图片width:100,高度自适应不变形，如何做，我设置width: 100%;图片高度必须设置px才出现，设置１００％就没有了，为什么？

html代码：

<div class="container">
    <div class="head-img"><img src='./themeimg.png'/></div>
    <div class="activiity">
        <div class="content1"></div>
        <div class="content2"></div>
    </div>
    <div class="rule"></div>
</div>

css　代码

.content1{
    background: url('./activity1.png') no-repeat;
    z-index: 4;
    background-size: 100% 100%; 
    background-position: center;
    width: 100%;
    height: 100%;
}

解决方案

height设置为rem试一下（body或html那里也要设置rem大小）

这篇关于css 背景图片显示问题，设置height:100%后无作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！