html - 修复背景图像，使其适合圆 Angular

Question

有什么方法可以修复背景图像，使其不会超出圆形边框？ jsFiddle

纯 CSS 解决方案更可取。

代码在这里:

<style>
div {
border-radius: 30px;
background-color: #dddddd;
margin:60px;
}

a{
position: relative;
display: block;
height: 90px;
padding: 15px;
background-image: url("http://dl.dropboxusercontent.com/s/stsc2r2vqd1y6ps/lab.png");
background-position: 0 top;
background-repeat: repeat;
}
</style>
<div><a href="#">some text</a></div>

Answer 1

发生这种情况是因为您没有阻止内部内容溢出分隔线的边界。要解决此问题，只需将 overflow: hidden 添加到您的 div:

div {
    ...
    overflow: hidden;
}