从图例元素中删除字段集边框和框阴影

Posted 2023-02-16

【中文标题】从图例元素中删除字段集边框和框阴影

【英文标题】：Remove fieldset boarder and box-shadow from legend element

【发布时间】：2013-10-31 23:58:19

【问题描述】：

我正在尝试从我的图例所在的区域移除背景线和阴影。在图例属性中将背景设置为透明后，我仍然可以看到线条。我的代码如下

html：

<fieldset>
<legend>text goes here</legend>
</fieldset>

CSS：

fieldset 
        margin:20px;
        padding:0 10px 10px;
        border:1px solid #666;
        border-radius:10px;
        box-shadow:0 0 10px #666;
        padding-top:10px;
   
 legend 
     margin: 0px 5px;
     padding: 5px;
     white-space: nowrap;
     background: transparent ; 
     font-weight: bold;
     font-size: 2em;
 

关于如何解决此问题的任何建议？

【参考方案1】：

这样就可以了

fieldset 
    border: 0;

【参考方案2】：

border 和 box-shadow 在 fieldset 上。只需添加以下内容，它应该可以工作：

fieldset
   border:0;
   box-shadow: none;

【讨论】：

我需要边框和阴影框保留在字段集的其余部分周围，而不是图例所在的位置。