css – 子元素bg颜色剪辑到父级border-radius

前端之家收集整理的这篇文章主要介绍了css – 子元素bg颜色剪辑到父级border-radius前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
有人知道一种迫切的方法来迫使儿童元素留在他们父母的边界半径吗?

这是我正在使用的js小提琴样本:
http://jsfiddle.net/fuego/qCNRZ/

标记

<div id="outer">
    <div id="inner">
        Nah nah nah<br/>
        Nah nah nah<br/>
        Nah nah nah<br/>
        Nah nah nah<br/>
        Nah nah nah<br/>
        Nah nah nah<br/>
        Nah nah nah<br/>
        Nah nah nah<br/>
    </div>
</div>

CSS:

#outer {
    width: 300px;
    background: red;
    border-radius:20px;

}

#inner {
    background:blue;
}

我只是希望容器现在看起来是蓝色的,但是父母用圆角边缘.我更新了小提琴以反映.

解决方法

根据您的示例,将overflow:hidden添加到您的#outer元素就足够了.

猜你在找的CSS相关文章