当前位置: 首页 > 知识库问答 >
问题:

我想显示一些项目在右侧的肚脐

李烨烁
2023-03-14
 <div class="container d-flex align-items-center">

  <nav class="nav-menu d-flex align-items-center">
    <ul>
      <li class="active"><a href="index.html">Home</a></li>
              
      <li><a href="#"><i class="fa fa-id-badge"></i> SUBSCRIBE</a></li>
        
    </ul>
     <ul>
     <li><a href="#"><i class="fa fa-id-user"></i> Sign Up</a></li>
      <li><a href="#"><i class="fa fa-id-user"></i> login</a></li>
        
    </ul>
  </nav><!-- .nav-menu -->

这是我的代码,我想在右侧显示注册和登录

共有1个答案

皇甫智明
2023-03-14

我添加了W-100来扩展NAV以适应整个容器,然后添加了justify-content-between,它将子级放置在彼此之间的所有空间中...

 <div class="container d-flex align-items-center">

  <nav class="nav-menu d-flex w-100 justify-content-between">
    <ul>
      <li class="active"><a href="index.html">Home</a></li>         
      <li><a href="#"><i class="fa fa-id-badge"></i> SUBSCRIBE</a></li>
    </ul>
     <ul>
     <li><a href="#"><i class="fa fa-id-user"></i> Sign Up</a></li>
      <li><a href="#"><i class="fa fa-id-user"></i> login</a></li>
        
    </ul>
  </nav>
</div>

这里有一支笔要演示:https://codepen.io/paulmartin91/pen/gogjejz

 类似资料:
  • 我有以下Java代码: 运行它,你可以看到可见文本是左向的。 请注意,这段代码并不能解决我的问题(它将文本向右对齐,但仅在组合框展开时): 如何在同一窗口中显示文本的右端(...__zzzzzz)?提前致谢!

  • 问题内容: 我搜索了许多帖子,发现支持HTML。所以我可以做 得到多行。上面的代码将导致 但是,我想要的是 仅在窗口不可调整大小(并且非常愚蠢)时,才可以在“按:”之前添加空格。谁能告诉我如何修改此代码以使其按我的意愿工作? 问题答案: HTML比@MadProgrammer的答案略简单:

  • 我在http://eiglaw.com上遇到了一个问题--在iPhone的屏幕右侧显示了一个大约25px宽的空白/边框。我研究了stackoverflow上的问题,这些帖子是相关的,但当我尝试提供的各种解决方案时,我都无法修复该问题: iPhone上的响应式网站-从景观到肖像旋转时不需要的空白 在iPhone Safari中呈现右白色边距的网站正文背景 缩放时页眉右侧有空白 我在iPad上也遇到过

  • 问题内容: 我遇到的问题是诸如’/’或’!’之类的字符 要么 ‘。’ 显示在左侧。 我只需要从右到左绘制文本,但是使用标准的,西方的,英语从左到右的符号表示文本字符。 如果不手动呈现文本,这可能吗? 问题答案: 我无法产生您的问题,能否请您使用我的SSCCE用于左侧显示。 从代码

  • 我在WordPress中生成一个有三层的菜单。我用代码来做: WordPress生成这样的菜单: 我必须将菜单分为两个菜单:在顶部的标题中,只有菜单的第一层可见。通过wp_nav_菜单的深度调用,这非常容易,而且效果很好。在侧边栏中,我想显示相应的第二级和第三级菜单(class.sub菜单下的所有内容),具体取决于标题中选择的内容。我尝试通过CSS通过两条简单的线来实现这一点: 不幸的是,这不起作

  • ap.showOptionButton() 显示导航栏右侧按钮。 代码示例 <script src="https://gw.alipayobjects.com/as/g/h5-lib/alipayjsapi/3.1.1/alipayjsapi.inc.min.js"></script> <button class="btn btn-default">显示 optionButton</button