我找到的所有css导航菜单教程都使用float:left来将菜单与网页的左侧对齐,所以当我尝试使用float:right来右对齐菜单时,菜单的位置颠倒了,例如:
The original menu (left-floated):
|Food | For | Life
The menu that I wanted to right-align (right-floated):
|Life | For | Food
那么,创建导航菜单而不会导致菜单反转的正确方法是什么呢?
我正在开发一个导航菜单。在这里我添加了第二个子菜单。所以我不能让第二个子菜单与子菜单内联
我的代码只是用jsfiddle编写的,让你们更容易理解。我知道这是CSS的一点变化。但是我还没有找到解决方案。有人能给我提个建议吗?
以下是我的代码
<ul>
<li>item one</li>
<li style="display:inline-block;">item two two two two two
<ul>
<li>Item sub<
我有足够好的HTML知识,但我只是被一些与我的响应式设计HTML CSS代码相关的东西卡住了。我关注了W3学校的网页,展示了如何为网站(Link)创建导航栏。 这是我当前的CSS文件和index.html body {
background-color: #FAEBD7;
margin: 0;
font-family: Arial, Helvetica, sans-serif;
}
/* Add a black background color to the top navigation */
.top-navbar {
position: relative
一开始,我正在研究如何创建一个超级下拉导航,因此我在网上四处搜索,最终意识到定义每个下拉菜单的宽度和位置是最好的。对不起,如果你不能理解,但我也找到了一个js.fiddle。
下拉导航的JS小提琴:。
然而,我意识到导航上的标题(例如。首页,5列等)不是均匀分布的,因为它们是固定的px。因此,我开始研究如何均匀地展开标题。然后我发现,实际上通过使用CSS display: inline with text justify,我可以做到这一点。如果这让你感到困惑,我很抱歉。但我也为这个找到了一把js小提琴。
使用css:实现均匀分布导航的JS小提琴
我试着通过添加span标签和justify属性将