css - 带有CSS的菜单中的透明边框

标签 css menu border transparent

我使用如下所示的菜单。如何将底部边框从白色更改为透明,以便边框显示为透明边框。现在,当我将边框设置为透明时,整个菜单都是橙色的(菜单的背景颜色):

ul#nav,
ul#nav ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
ul#nav li {
    position: relative;
    float: left;
    width: 118px;
}
#nav li ul {
    position: absolute;
    left: 0;
    top: auto;
    margin-left: -999em;
    border-top: 11px transparent;
}
#nav li  li {
    width: 135px;
    z-index: 1;
}
#nav li ul ul {
    position: absolute;
    left: 100%;
    top: -.1em;
    margin-left: -999em;
}
ul#nav li a {
    display: block;
    text-decoration: none;
    text-align: left;
    background: white;
    border: none;
}
* html ul#nav li a { height: 1% }
#nav li:hover a,
#nav li.over a,
#nav li:hover li:hover a,
#nav li.over li.over a,
#nav li:hover li:hover li:hover a,
#nav li.over li.over li.over a,
#nav li:hover li a:hover,
#nav li.over li a:hover,
#nav li:hover li:hover li:hover a:hover,
#nav li.over li li a:hover,
#nav li:hover li:hover li:hover li:hover a:hover,
#nav li.over li.over li.over li.over a:hover {
    color: #ff7f00;
    background-color: white;
}
#nav li:hover li a,
#nav li.over li a,
#nav li:hover li:hover li a,
#nav li.over li.over li a,
#nav li:hover li:hover li:hover li a,
#nav li.over li.over li.over li a {
    color: white;
    background: #ff7f00;
    margin-left: -10px;
    border-bottom: 1px solid #FFFFFF;
    filter: alpha(opacity=95);
    -moz-opacity: 0.95;
    opacity: 0.95;
}
#nav li ul li a { padding: 25px 7px 7px 7px }
ul#nav li:hover ul ul,
ul#nav li:hover ul ul ul,
ul#nav li.over ul ul,
ul#nav li.over ul ul ul { margin-left: -999em }
ul#nav li:hover ul,
ul#nav li li:hover ul,
ul#nav li li li:hover ul,
u#navl li li li li:hover ul,
ul#nav li.over ul,
ul#nav li li.over ul,
ul#nav li li li.over ul { margin-left: 0 }

最佳答案

border-bottom:2px solid rgba(0,0,0,.5);

关于css - 带有CSS的菜单中的透明边框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11395663/

相关文章:

javascript - 找到div的静止高度

html - 无法在标题上指定背景颜色

CSS Accordion 菜单 - 如何扩展和超链接 <div>

javascript - 使用文本框值更改按钮单击时的 CSS

html - 在 CSS 中为顶部和底部边框创建波浪形边框

html - 如何创建圆 Angular block ,它由三部分组成 : top, 内容,底部?

javascript - 动态 div 在鼠标滚轮上水平和垂直滚动

html - 使用 Sub-Menus 将 Sub-Sub-Menus 添加到 CSS 菜单

css - 查看时突出显示子菜单项

border - tcpdf 中单元格的不同边框由 "setlinestyle"