尝试将CS​​S圈定位在图像的顶部

Question

我有一个圆形图像，我希望能够用CSS圈子覆盖。如何定位CSS圆圈以使其始终与圆形图像匹配相同的高度和宽度？

图像属性如下：

max-width: 270px;
height: 270px;
width: 100%;
border-radius: 50%;
border: none;

由于

<li class=\"mis-slide\">
    <a class=\"mis-container\" ">
        <figure>
            <img></img>
            <figcaption>
                <span></span>
                <div>Text</div>
            </figcaption>
        </figure>
    </a>
</li>

Answer 1

假设您知道圆的高度，您可以使用图像下方div的相对位置

position: relative;
bottom: 270px;

或图像上方的div

position: relative;
top: 270px;

小提琴：http://jsfiddle.net/444vc9u8/3/