css - 使用悬停时我无法让剪辑消失

Question

出于某种原因，当我将鼠标悬停在某个对象上时，我的代码不允许我禁用剪裁。这是我正在使用的代码。我很确定我一切都正确，如果有帮助，我正在使用谷歌浏览器。

<section id="map">
     <figure id="point0">
        <img src="image0.jpg" alt="" />
        <figcaption>
           <time>3:30 a.m.</time> Start from the Longs Peak Ranger
           Station, nine miles south of Estes Park. Be sure to pack 
           food, extra water, 
           sunblock, warm clothes, gloves, and caps.
        </figcaption>
     </figure>

     <figure id="point1">
        <img src="image1.jpg" alt="" />
        <figcaption>
           <time>5:30 a.m.</time> Stop at Mills Moraine for a 
           view of the sunrise.
       </figcaption>
     </figure>

     <figure id="point2">
        <img src="image2.jpg" alt="" />
        <figcaption>
           <time>7:30 a.m.</time> Time for a break at Granite Pass.
        </figcaption>
     </figure>

     <figure id="point3">
        <img src="image3.jpg" alt="" />
        <figcaption>
           <time>8:30 a.m.</time> Climb through the Boulder Field 
           on the way to the Keyhole.
        </figcaption>
     </figure>

     <figure id="point4">
        <img src="image4.jpg" alt="" />
        <figcaption>
           <time>9:00 a.m.</time> Stop at the
           Agnes Vaille shelter for a well-deserved breakfast.
        </figcaption>
     </figure>

     <figure id="point5">
        <img src="image5.jpg" alt="" />
        <figcaption>
           <time>9:30 a.m.</time> It's time to go through
           the Keyhole. Be prepared for heavy winds.
        </figcaption>
     </figure>

     <figure id="point6">
        <img src="image6.jpg" alt="" />
        <figcaption>
           <time>10:00 a.m.</time> Follow the painted targets 
           along the Ledges.
        </figcaption>
     </figure>

     <figure id="point7">
        <img src="image7.jpg" alt="" />
        <figcaption>
           <time>11:00 a.m.</time> Take special care when crossing 
           the Narrows.
        </figcaption>
     </figure>

     <figure id="point8">
        <img src="image8.jpg" alt="" />
        <figcaption>
           <time>11:15 a.m.</time> You're almost there! Climb the
           Homestretch to reach the summit.
        </figcaption>
     </figure>

     <figure id="point9">
        <img src="image9.jpg" alt="" />
        <figcaption>
           <time>11:45 a.m.</time> Congratulations, you've reached 
           the top! Time for lunch and a few photos.
        </figcaption>
     </figure>

  </section>





figure {
    background-color: rgb(70, 76, 222);
    color: white;
    width: 150px;
    border-radius: 15px;
    position: absolute;
    z-index: 1;
    clip: rect(auto, 20px, 20px, auto);
}

figure:hover {
    clip: none;
    z-index: 2;

}

figure figcaption {
    font-size: 12px;
    margin: 10px;
}

因此悬停不会禁用剪辑效果并让图像变得未剪辑并且没有意义。

Answer 1

figure:hover {
    clip: none;
    z-index: 2;

}

默认应该是 clip: auto 我相信:

figure:hover {
    clip: auto;
    z-index: 2;

}