悬停第一步，先上效果图
这个其实是一个bootstrap实现的响应式导航，我们今儿要做的了其实是鼠标hover效果，看到那些个Home、About us...底下的三个小点点没有，这个就是一个sex的效果，鼠标移上会有仨点点，而这仨点点呢又不是一下子出来的，是从中间点点往两边散开 形成三个
好了上代码，html导航的结构就不用多说了把，ul li，相信你可以的
这里呢看到好多类是不是，因为用的是bootstrap的结构写的，平时静态的话其实不用那么复杂
结构不多说，主要说下下面点点的实现，我们得用上：before，当然也有：：before，其实一个冒号跟两个冒号没有本质的区别，都是表示在什么什么之前，他这么写主要只是为了区分css2和css3，也就是ie和主流浏览器。双冒号的话貌似只兼容火狐谷歌等，不考虑ie。
然后呢 我们需要这个before先再内容下面用定位实现一个点点，然后用css3的文字阴影去实现两边的点点
自行理解哈，若有疑问可去142991222找小姐姐我
好了 上完整的代码
至于我样张图上的效果，请听下回分解。哈哈哈，或者你来逼供也行142991222
网友评论