利用bootstrap框架的字体图标和下拉菜单效果，以及css3的动画效果，可以做出比较优雅的按钮式下拉菜单样式
?<style> ???.myBtnStyle .dropdown-menu span{ ?????margin:5px; ???} ???.myBtnStyle .dropdown-menu { ?????animation: 0.5s linear fadeIn; ?//css3新特性animation ???} ???@keyframes fadeIn { ?//通过keyframes规则创建动画特效，原理为将一套css样式逐渐转化成另一种css样式 ?????0%{opacity:0;transform: translateY(-20);} ?????100%{opacity: 1;transform: translateY(0);} ???} ?</style></head><body> ?<div class="container"> ???<div class="dropdown myBtnStyle open"> ?????<button class="btn btn-default dropdown-toggle" data-toggle="dropdown"> ???????explotion ?????</button> ?????<ul class="dropdown-menu"> ???????<li><a href="#"> ?????????<span class="glyphicon glyphicon-headphones"></span> ??//span标签包裹的字体图标 ?????????moving</a></li> ???????<li><a href="#"> ?????????<span class="glyphicon glyphicon-headphones"></span> ?????????raging</a></li> ???????<li><a href="#"> ?????????<span class="glyphicon glyphicon-headphones"></span> ?????????daniangmener</a></li> ???????<li><a href="#"> ?????????<span class="glyphicon glyphicon-headphones"></span> ?????????holy</a></li> ?????</ul> ???</div> ?</div></body>用bootstrap和css3制作按钮式下拉菜单
原文地址：http://www.cnblogs.com/sticktong/p/7580603.html