加了背景颜色图片只显示一半

问题遇到的现象和发生背景

img


加这个背景颜色就变成这样了

img


不加这行

img

我想要达到的结果

html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>title>
        <style type="text/css">
            *{
               margin-top: 10px;
               /*background-color: lightsteelblue;*/
            }
                .hang{
        width: 1240px;
        margin: 0 auto;
        }
        .hang{
            position: relative;
            
            width: 1240px;
            height: 1000px;
            top: 220px;
        }
        .hty{
            width: 460px;
            position:absolute;
            left: 525px;
            height: 750px;
            border: 2px solid #00BFFF;
            background-color: rgba(0,255,255,0.1);
        }
        .hty1{
            position: absolute;
            left: 0;
    
        }
        .hty2{
            position: absolute;
            left: 260px;
            
        }
        .hty4{
            position: absolute;
            top: 400px;
        }
        .hty3{
            position: absolute;
            left: 260px;
            top: 400px;
        }
         .kpnr{
            position: absolute;
            left: 10px;
            width: 620px;
            height: 800px;
  
        }
        style>
    
    head>
    <body>
    
        
        <div class="hang">
            <div class="hty">
                
                <div class="hty1"><img src="../img/th.jpg" width="200px" height="200px"/>div>
                <div class="hty2"><img src="../img/th.jpg"width="200px" height="200px"/>div>
                <div class="hty3"><img src="../img/th.jpg"width="200px" height="200px"/>div>
                <div class="hty4"><img src="../img/th.jpg"width="200px" height="200px"/>div>
                
            div>
            <div class="kpnr">
                
                <div class="kp1"><img src="../img/QQ图片20221112223710.jpg"width="200px" height="200px"/>div>
                <div class="kp2"><img src="../img/QQ图片20221112223710.jpg"width="200px" height="200px"/>div>
                <div class="kp3"><img src="../img/QQ图片20221112223710.jpg"width="200px" height="200px"/>div>
                
            div>
            div>
        
    body>

html>

img

给你的 hty这个class中的css添加一个层级就好了， 例如z-index: 100;
完整代码如下 

.hty {
            width: 460px;
            position: absolute;
            left: 525px;
            height: 750px;
            border: 2px solid #00BFFF;
            background-color: rgba(0, 255, 255, 0.1);
            z-index: 100;
        }