Question

是否有一种更漂亮和/或更好的方法可以将a中的某些nav元素与右边的float:right对齐，而将其他元素保留在左边，而不是使用浮点数？
nav将浮动元素移动到clear:both;的顶部，而不是将它们保持在原来的高度。
这必须是一个足够普遍的问题才能有一个好的解决方案。 <nav>  <a href="#"><img src="img/logo.svg" /></a> <a href="#">Foo</a> <a href="#">Bar</a>  <a href="#">Potato</a> <a href="#">Tomato</a> </nav> - 修复损害赔偿的div或css并不是真正的解决方案。

这基本上就是我的代码。

{{1}}

Answer 1

向你的a添加类，如html中所示。

HTML：

   <nav>
      <!-- left-aligned -->
        <a class="left" href="#"><img src="img/logo.svg" /></a>
        <a class="left" href="#">Foo</a>
        <a class="left" href="#">Bar</a>
      <!-- right-aligned -->
        <a class="right" href="#">Potato</a>
        <a class="right" href="#">Tomato</a>
    </nav>

和css：

nav .left {
    float: left;
}

nav .right {
    float: right;
}

此外，在您这样做之后，如果不起作用，您可能需要确保导航的宽度足够长，因此它们并非全部都在一起。与nav { width: 100%; }

一样

左右对齐<nav> </nav>中的链接

1 个答案: