Question

http://i.stack.imgur.com/TP7rY.png

这就是问题，我正在尝试'但我不能从圆角中删除背景颜色。

HTML

<div id="principal" align="center">
<header>
        <h1>
            <img src="images/pg_img.png" onMouseOver="this.src='images/pg_img_hover.png'" onMouseOut="this.src='images/pg_img.png'";>
        </h1>
    </header>
</div>

CSS

#principal {
    background-color:rgb(255, 255, 255);
    background-color:rgba(255, 255, 255, 0.5);
    margin:20px;
}
#principal header {
    margin:0px;
    width:100%;
}
#principal header h1 {
    border:15px solid black;
    border-radius:20px 20px 0 0;
}

嗯，上面是代码。

Answer 1

看看这是否可以帮到你。

双向

#principal {
    background-color:rgba(255, 255, 255, 0.5);
    margin:20px;
    border-radius:20px 20px 0 0;
    overflow:hidden;
}
#principal header {
    margin:0px;
    width:100%;
}
#principal header h1 {
    border:15px solid black;
}

或者

#principal {
    margin:20px;
}
#principal header {
    margin:0px;
    width:100%;
}
#principal header h1 {
    background-color:rgba(255, 255, 255, 0.5);
    border:15px solid black;
    border-radius:20px 20px 0 0;
}

Answer 2

问题是您的背景颜色位于#principal，而您的圆角位于#principal header h1

试试这个

从#principal

中删除此内容

background-color: rgb(255,255,255);
background-color: rgba(255,255,255,0.5);

并将其移至#principal header h1

#principal header h1 {
    background-color: rgb(255,255,255);
    background-color: rgba(255,255,255,0.5);
}

从圆角删除背景

2 个答案: