当前位置: 首页 > 面试题库 >

浮动:向右反转跨度顺序

冷宏茂
2023-03-14
问题内容

我有HTML:

<div>
    <span class="label"><a href="/index/1">Bookmix Offline</a></span>
    <span class="button"><a href="/settings/">Settings</a></span>
    <span class="button"><a href="/export_all/">Export</a></span>
    <span class="button"><a href="/import/">Import</a></span>
</div>

和CSS:

span.button {
    float:right;
}

span.label {
    margin-left: 30px;
}

在浏览器中,跨度以相反的顺序显示:导入导出设置。我可以仅通过更改CSS文件并保留HTML来更改顺序吗?


问题答案:

解决此问题的一般方法是反转HTML中右浮动元素的顺序,或将它们包装在包含元素中,然后将其浮动到右侧。



 类似资料:
  • 问题内容: 如果我有三个向右浮动的元素,那么为什么顺序跟随(请参阅jsfiddle),而元素3实际上是最后一个元素,则元素1是右侧的第一个元素。 现在订购 但是元素在html中按此顺序 为什么? 问题答案: 这种“倒序”是预期的结果。 您可以根据需要在CSS规范中进行深入研究,但是示例将按原样进行渲染。 如果您希望它们以与标记相同的顺序显示,请向右浮动,其子项向左浮动。

  • 所以我在一个网站上建立了一个包含搜索栏的navbar,同时还有一个分组按钮。它在桌面视图上运行良好,但当我缩小到移动视图时,站点会产生可折叠菜单,搜索栏会留在左侧,但按钮会浮到右侧。当我用它周围的input-group-btn类移除span时,就没有这个问题了。 图片包括http://bit.ly/1G706RC 编辑:我修复了我自己的问题!我只需将一个类添加到span中

  • 问题内容: 我有一个页面,其中页眉由三个div组成-一个浮动在左侧,一个浮动在右侧,以及一个在它们之间。我希望该中心div居中,但遗憾的是不存在,我不能只是将其浮动到左侧并添加填充,因为它必须根据窗口大小进行更改。 有什么简单的我可以忽略的吗?还是我会怎么做? 更新: 此外,我想找到一种方法将中间div居中于div 之间的空间 中,以防看起来更好。 问题答案: 如果您有两个浮动div,那么您知道边

  • 我正试图将列表设置为在div中向右浮动,但这不起作用。下面是html代码, 这是我正在努力使它工作的css 编辑:我的意图是将标题文本(MakeItWork)保持在页面的左侧,而列表(包含home、content和shop作为列表项)保持在页面的右侧

  • 我试图在一个区域内放置一个div,并保持它垂直居中,然后它的内部有两个跨度,一个向左浮动,另一个向右浮动。但是我似乎不能同时做这两件事。我在React中这样做,但我不认为这会有什么不同,但我加入它来解释语法。 我先说: 然后我有ResultsHeader定义为: 当我这样做时,我会将所有span文本移到左侧,例如找到的。如果我将显示更改为,跨距将正确浮动,但文本不再垂直居中。取而代之的是,这一切都

  • 问题内容: 一般问题:反向流的正确方法是什么?假设我们不知道流包含什么类型的元素,反转任何流的通用方法是什么? 具体问题: IntStream提供了range方法来生成特定范围内的,现在我想将其从0切换为负数将无法正常工作,也无法使用 与IntStream我会得到这个编译器错误 错误:(191,0)ajc:sorted()类型中的方法IntStream不适用于参数(Integer::compare