Html CSS栏类型菜单

我暂时尝试解决用户界面的逻辑问题。正如你所能想象的那样，这是一个全新的概念，而且仍在深入研究CSS的内容

我正在尝试创建一个“条形”菜单，其中内部有一个固定的宽度，左侧有徽标，右侧有菜单项。这里有一张图片告诉你我的意思：

以下是我走了多远：

问题是：我不知道该如何把菜单项放在吧台中间的右侧。。我尝试将它们向右浮动（顺序改变），并给它们一个绝对值。。。他们都没帮上忙

---

我肯定我漏掉了一点，所以我想尝试一下

您可以将

ul

与

li

项目

display:inline

一起使用，并将其绝对放置在相对定位的容器中

我真的不认为绝对定位是你想要的，因为以后添加新项目会很痛苦。我认为这更接近你想要的，但你必须打那个电话。我的主要想法是使用

position:relative

使菜单项

inlineblock

，这样项目将以正确的顺序和良好的布局呈现。即使使用相对定位，也可以使用

边距

向左或向右轻推项目

#content{
    background-color: gray;
    height: 25px;
    width: 600px;
    margin-left: auto;
    margin-right: auto;
    position:relative;    /* ADD THIS LINE */
}
#menu{                    /* ADD THIS STYLES */
    position:absolute;
    right:0px;
    top:0px;
}

编辑 我创造了一个新的叉子，我想这一次省下了我的工作。另外，我决定继续使用

float

范式，因为这可能更符合您的需要。诀窍是将

#menu

设置为向右浮动，而菜单项则向左浮动。我不想添加它，但您可能需要添加新行以清除浮动行为：

#menu:after { clear:float; }

---

这一个成功了！非常感谢。顺便问一下，我做这个接口的方式正确吗？而且，我完全理解那里的绝对位置，但是相对位置是怎么回事@Zettam如果你移除父母的

相对
位置，那么
绝对
定位的孩子将离开家：）移除父母的
相对
，试着自己看看“问题”！所以，当我们需要绝对位置的东西，我们需要检查他们的父母，如果我理解你的正确..嘿，谢谢你的答复，但我看到的一切几乎与我以前的CSSDeck相同看起来我忘了保存。我将重试并编辑链接。