如何使 Zurb Foundation 顶部栏导航居中?

How do I center the Zurb Foundation top bar nav?(如何使 Zurb Foundation 顶部栏导航居中?)
本文介绍了如何使 Zurb Foundation 顶部栏导航居中?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着跟版网的小编来一起学习吧!

问题描述

我的网站上的顶部导航栏左对齐如下:

The top bar nav on my site is left aligned like this:

| Home | aveoTSD | Silent Nite          |

我想像这样将顶部栏导航居中:

I would like to center the top bar nav like this:

|          Home | aveoTSD | Silent Nite          |

将它与带有示例"文本的红色条完全一样居中.

Center it exactly like the red bar with "Example" text.

这里是我的css.

推荐答案

您可以通过将其添加到您的 CSS 来实现(最好删除冲突的样式):

You can do it by adding this to your CSS (and preferably removing conflicting styles):

.top-bar-section ul {display: table; margin: 0 auto;}
.top-bar-section ul li {display: table-cell;}

这篇关于如何使 Zurb Foundation 顶部栏导航居中?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!

本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除!

相关文档推荐

Evenly spaced list items(均匀分布的列表项)
Position: sticky - scroll bouncing when combined with javascript height adjustment(位置:粘性 - 结合 javascript 高度调整时滚动弹跳)
Flexslider arrows not displayed properly(Flexslider 箭头未正确显示)
Make whole lt;ligt; as link with proper HTML(让整个lt;ligt;作为与正确 HTML 的链接)
CSS radial menu(CSS 径向菜单)
Dynamically create jQuery Mobile page via JavaScript after clicking(点击后通过 JavaScript 动态创建 jQuery Mobile 页面)