Z-Blog简易二级导航菜单CSS

吐槽/反馈/建议:我的咸鱼心

历史原因,Z-Blog的导航、友情链接管理都比较复杂,虽说将来预定会在系统层面进行修改,眼下作为过渡,推荐使用-链接管理中心-插件;

插件目前已支持二级导航,只是前台效果需要主题自行适配。

下边代码适用于default主题,本文发出不久后预计将直接内置。

#divNavBar li {
  position: relative;
}
#divNavBar li ul {
  display: none;
  position: absolute;
  left: 0;
  white-space: nowrap;
  /* ↓↓ 一般设置为和#divNavBar高度相同 */
  top: 36px;
  /* ↓↓ 背景色同样以实际为准 */
  background-color: #297bc4;
}
#divNavBar li:hover ul {
  display: block;
}

对于响应式主题需要考虑手机站效果,不一而足。

使用Bootstrap等前端框架构建的主题也可使用其导航组件,链接管理插件支持自定义模板,可直接生成需要的html结构,并不局限于ul->li>(a+ul>li>a)这种形式。

分享到微信

扫描二维码

可在微信查看或分享至朋友圈。

相关文章

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

召唤伊斯特瓦尔