html - 删除圆 Angular 背景

Question

/image/TP7rY.png

这就是问题所在，我正在尝试，但无法从圆 Angular 中删除背景颜色。

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;
}