前天认识个狠角色，就是久伴博客的老板，居然赞助我虚拟主机，大大激发了我对独立博客的折腾欲，竟然一口气绑定了3个域名，准备把三个程序各做1个站点来研究。其中 wordpress 程序准备用的是 dmeng 主题，然后同时在林三在线这里弄个页面写下开发进度。但这样一来，我的顶部导航就显得很长，很臃肿，这才想到把几个主题收到二级目录里面来，便有此文。
显示二级菜单引用这个页面的内容：https://www.cnblogs.com/wuqianling/p/6762146.html
果然是简单粗暴呢，写的很详细，效果也是令人很满意的，于是还忍不住复制了一份到记事本中保存，生怕原来网页过期的说。然后不知道怎么的，就对下拉菜单的三角指示标志感兴趣了。
- .sub-menu:before {
- content: ” “;font-size: 0;line-height: 0;
- margin: 0 auto;/*居中*/
- display: block;/*独占一行*/
- box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.2); /*配合整体一样的投影*/
- background-color: #222;width: 10px;height: 10px;
- -webkit-transform: rotate(45deg);
- transform: rotate(45deg); /*正方形倾斜四十五度是三角但要把下半部分藏起来*/
- position: relative;
- top: –5px; /*果断的露出上半部分*/
- z-index: 1; /*果断的隐藏下半部分*/
- -webkit-transition: all .2s ease-in;transition: all .2s ease-in;}
然后在二级菜单的a链接中加上 z-index:2 属性，居然没有效果，本来打算放弃的，结果在左伴的群里面认识了玩技e族的老铁，非要帮我实现效果，最终发现需要设置 position:relative 才行。
转载请注明：林三定制 » 给begin主题增加二级菜单相关的css
