1

我正在尝试制作带有内部图像链接的圆形 div，图像是不透明度的一半，当悬停在它们上方时，它们会变成完全不透明度（我正在使用 jQuery 这样做）。它们在 Chrome、Firefox 和 IE 中的工作方式完全符合我的要求，但它们在 Opera 和 Safari 中的表现非常有趣。

这是该页面的 webdevout：

http://www.webdevout.net/test?06

这是我的代码：

        <div class="cSpan">
           <h2 style="text-align: center;">Piercings</h2>
            <div class="circle">
                <a href="#"><img src="images/img03.png"></a>
            </div>
            <p> view more </p>
        </div>

和风格

    .cSpan {
        display: inline-block;
        width: 280px;
        margin: -8em 3em 0 3em; }

    .circle {
        width:260px;
        height:260px;
        border-radius:50% 50% 50% 50%;
        overflow:hidden;
        float: left;
        margin-bottom: 0.5em;
        border: 10px solid #100000; }

    .circle img {
        margin-left:-50%;
        margin-top:-50%;
        opacity: 0.5; }

我一直在努力解决这个问题，所以我希望我能在这里得到一些帮助，谢谢！:)

4

0 回答 0