Html 使用CSS右对齐菜单项而不反转它们

如何使所有菜单项（除主页外）位于右侧，而不颠倒顺序（即将功能保留为第一项）

请参阅下面我的代码：

*{框大小：边框框；}
正文{字体系列：Verdana，Geneva，无衬线；字体大小：10pt；颜色：#828282；}
.header{padding:10px；}
.header ul{列表样式：无；}
.header ul li{display:inline}

与此相同，将

标题

右对齐

文本

，然后将

浮动：左

作为列表的第一个子项-您忘记关闭

li

标记

*{
框大小：边框框；
}
身体{
字体系列：Verdana，日内瓦，无衬线；
字号：10pt；
颜色:"828282 ;；
}
.标题{
填充：10px；
文本对齐：右对齐；
}
.标题ul{
列表样式：无；
}
李先生{
显示：内联
}
李：第一个孩子{
浮动：左
}

如果您想将整个菜单移到右侧，可以对ul元素使用float:right。在您的情况下，它将是：

.header ul {float: right;}

工作小提琴示例：

编辑：这是一个更新，主页在左侧，菜单的其余部分在标题的右侧：

.header ul {list-style: none; text-align:right;}
.header ul li {display: inline}
.header ul li:first-child{float:left}

---

小提琴演示链接：

您必须为此制作两个菜单，并且您可以实现输出，请尝试以下代码：-

<div class="header">
    <ul>
        <li><a href="#">Home</a></li>
    </ul>
    <ul class="right-menu">
        <li><a href="#">Features</a></li>
        <li><a href="#">Pricing</a></li>
        <li><a href="#">Sign up</a></li>
        <li><a href="#">Login</a></li>
    </ul>
</div>

---

它可能会帮助您。

使用

方向：rtl和<代码>浮动：左侧打开
li:第一个孩子
。请参阅片段


*{
框大小：边框框；
}
身体{
字体系列：Verdana，日内瓦，无衬线；
字号：10pt；
颜色:"828282 ;；
}
.标题{
填充：10px；
}
.标题ul{
列表样式：无；
}
李先生{
显示：内联
}
保险商实验室{
方向：rtl；
}
李：第一个孩子{
浮动：左
}













将您的
ul
拆分为
。左菜单
用于主页，右菜单

用于其他项目，然后将

浮动：左

添加到

左菜单

和

浮动：右

添加到

右菜单

，最后将添加到标题以强制您的其他元素位于菜单下方：

*{框大小：边框框；}
正文{字体系列：Verdana，日内瓦，无衬线；；颜色：#828282；}
.header{padding:10px；}
：隐藏；
显示：块；
字号：0；
内容：“；
明确：两者皆有；
身高：0；
}
.header ul{列表样式：无；}
.header ul.left-menu{float:left；}
.header ul.right-menu{float:right；}
.header ul li{display:inline}

是否要将整个菜单移到右侧（如下图所示）：@DejanMunjiza除了我想保留在左侧的“Home”之外，整个菜单都要保留在左侧OK，我将其作为答案发布。无论如何，这里有一个小提琴链接：这将使右菜单浮动在左下，左菜单也需要浮动：左。对不起，这是我的错误。：）

.header .right-menu{
   float: right;
}