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

如何使标签在div中水平排列?

乐正宜人
2023-03-14
问题内容

我需要使图像在div中水平并排显示。我怎样才能做到这一点?

HTML:

<div class="Wrapper">
  <img src="/wp-content/uploads/2012/07/TFT.png" alt="Smiley face" height="90" width="95" />
  <img src="/wp-content/uploads/2012/07/Ltyt.png" alt="Smiley face" height="90" width="95" />
  <img src="/wp-content/uploads/2012/07/artspng" alt="Smiley face" height="90" width="95" />
</div>

问题答案:

您也可以使用CSS属性 display:inline-blockfloat:left 实现此目的。

HTML代码

<div>
    <img ... />
    <img ... />
    <img ... />
</div>

CSS代码

div img{ display: inline-block;}

要么

div img{ display: block;float: left;margin-right: 5px;}


 类似资料:
  • 问题内容: 由于某些原因,我的div不会在包含div的水平居中: 有时有一个行div,其中只有一个块div。我究竟做错了什么? 问题答案: 要实现您想要做的事情: 考虑使用代替。

  • 问题内容: 我有一个div,希望它水平居中-尽管我给它的是不居中… 问题答案: 您需要设置和。 这指定了从窗口侧面偏移边缘边缘的距离。 类似于“ top”,但指定框的右边距边缘与框的包含块的[right / left]边缘的[left / right]偏移多远。 注意: 元素的宽度必须 小于 窗口的宽度,否则它将占用窗口的整个宽度。 如果可以使用媒体查询来指定 最小 边距,然后过渡到更大的屏幕尺寸

  • 问题内容: 我有一张智能滚动的卡片清单,虽然我喜欢的外观,但令人沮丧的是它的排列顺序从上到下,如下所示: 对于内容加载量超过几个项目的任何事物,这种垂直排序似乎基本上没有用。如果我有50个项目,那么一些最不重要的项目将位于顶部! 我已经尝试过使用flexbox进行一些变体,但是什么也无法工作。有人可以横向订购吗? 问题答案: 如所记录的,CSS列的顺序是从上到下,然后是从左到右,因此呈现的列的顺序

  • 问题内容: 我有一个部门想要显示图像,然后单击以在灯箱中打开它们。我将它们向左浮动并在线显示它们。设置overflow- x进行滚动,但是一旦行空间不足,它仍然会将图像放在下面。我想让它们内联,并在需要时显示水平滚动。 注意: 我无法更改内部图像的结构。它必须是锚点内的img。我的灯箱就这样要求它。 HTML: CSS: 我知道这是非常基本的,但是我做不到。不知道怎么了 问题答案: HTML中可能

  • 我正在使用一个chart-js条形图,它必须放在一个小的div中,所以我在寻找一种方法来使x轴上的标签水平而不是对角线。重点是为实际的条获得尽可能多的高度,因为现在标签占据了几乎40%的可用空间。 这是我的代码: 我已经暂时禁用了xAxis标签。它的工作,但理想情况下,我希望他们是水平的。想法?

  • 问题内容: 我需要将两个div彼此对齐,以便每个都包含一个标题和一个项目列表,类似于: 使用表非常容易,但是我不想使用表。我该如何实现? 问题答案: 将div浮动到父容器中,并设置其样式如下: