带有2个项目的css菜单栏（左端和右端）_Css_Menu_Position

带有2个项目的css菜单栏（左端和右端）

css menu

带有2个项目的css菜单栏（左端和右端）,css,menu,position,Css,Menu,Position,我在网上找不到解决办法。所以我在这里发帖我想创建一个包含两个项目的条形图，一个在左端，一个在右端： “文本”……”img’ “img”，因为我也在看如何放置图标以下是我想要的：见9:07 不幸的是，他没有在他的教程中说明他是如何做到这一点的您可以看到“菜单”和图标之间有一个空元素 <div> <div class="handle">Menu</div> <div class="icon"></span> <

我在网上找不到解决办法。所以我在这里发帖

我想创建一个包含两个项目的条形图，一个在左端，一个在右端：

“文本”……”img’

“img”，因为我也在看如何放置图标

以下是我想要的：见9:07

不幸的是，他没有在他的教程中说明他是如何做到这一点的

您可以看到“菜单”和图标之间有一个空元素

<div>
    <div class="handle">Menu</div>
    <div class="icon"></span>
</div>


菜单

谢谢

帕特里克请试试这个：

HTML:


这里有文字
图为：

CSS:


.处理{
浮动：左；
} 
.图标{
浮动：对；
}

请发布您的代码。这可以通过将文本“text”和“img”包装在两个不同的

中，然后将第一个

浮动到左侧，将第二个

浮动到右侧来轻松完成。谢谢，菜单，所以图标向右浮动，然后？我没有看到中间的元素，就像在视频中一样。请检查我下面的答案。谢谢！但在视频中，您可以看到在“菜单”和图标之间选择的空元素。他是怎么做到的？你指的是“菜单”文本和图标之间的可点击部分吗？是的，那个可点击部分。谢谢。。。“菜单”和图标之间仍然没有任何内容。实际上，在你引用的视频中，“菜单”和图标之间没有任何元素。它是一个简单的锚定标记，其中文本向左对齐，图标向右对齐。因为它是锚定标记，所以您可以单击它上的任何位置。在9:07的视频中，你所指的空白元素就是文本和图标之间的空白。

<html>
     <body>
          <div>
              <div class="handle">Text goes here</div>
              <div class="icon">Image goes here: <img src="" /></div>
          </div>
     </body>
</html>

<style>
.handle {
    float: left;  
} 

.icon {
    float: right;  
}     
</style>