有谁知道这个dropdown旁边的向下箭头是怎么做出来的?

Smeagol 发布于 2011/11/30 09:18
阅读 980
收藏 1

http://twitter.github.com/bootstrap/javascript.html#dropdowns  这个是效果的链接。dropdown旁边的向下箭头没有尾巴,这里应该用的是↓ 但是我不知道他是怎么实现,求高手解答。

dropdown

加载中
0
pyawen
pyawen
<style>  
a.menu {line-height:32px }
a.menu:after {    
  margin-left: 5px;  
  margin-top:15px;
  display: inline-block;
  content: "&darr;"; 
  text-indent:-9999px;
  vertical-align: top;   
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid #999;
  filter: alpha(opacity=50); 
  -khtml-opacity: 0.5;
  -moz-opacity: 0.5;
  opacity: 0.5; 
}
</style>
 <a class="menu" href="#">aaa</a>

参考你给你页面 用html5做的
pyawen
pyawen
@Smeagol : 箭头是边框来处理的,不需要里面的内容 内容只是为了撑起边框
S
Smeagol
而且为什么这里text-index是-9999px,这个箭头应该看不见了才对
S
Smeagol
为什么我自己提取的不行,你这里可以。。。
0
小编辑
小编辑
这种一般是用图片的吧
0
pyawen
pyawen
上面用了很多 html5的属性  ie支持不是很好  最好用图片来处理
0
子木007
S
Smeagol
用你这里的第二种方法时,如果放在dropdown上面,当鼠标经过时,dropdown按钮的焦点会丢失,会切换到这个箭头上,有没有什么办法让这个箭头显示的像背景一样。
S
Smeagol
这个还要外挂一个字体啊?!
返回顶部
顶部