0

来源：http: //twitter.github.com/bootstrap/components.html#navbar

为了使下拉菜单的黑色小三角形，Twitter 使用以下 CSS：

.caret 
{
    display: inline-block;
    width: 0;
    height: 0;
    vertical-align: top;
    border-top: 4px solid black;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
    content: "";
    opacity: 0.3;
    filter: alpha(opacity=30);
}

我尝试使用<b class="caret"></b>但颜色是灰色的。如果您在 Twitter Bootstrap 页面上并删除内容：“”三角形也将是灰色的。如果我在 HTML 样式标签中添加代码

<b style="-the code-"></b>应该是黑色的。为什么会这样？

更新：

代码是相同的，但是当它在 CSS 文件中时，opacity: 0.3 是使三角形变灰的那个，但为什么 HTML 样式标签中没有发生这种情况？

4

1 回答 1

0

它不会变灰，因为你包括

content: "";

进入

<b style="-the code-"></b>

并且双引号正在干扰。修复它做

<b style="... content: ''; ..."></b>

这将起作用 -演示

于 2012-07-15T23:22:06.583 回答