以下两种放置方式有什么区别<div>?

  • 本文关键字:区别 div 两种 方式 html
  • 更新时间 :
  • 英文 :

的方法有什么区别?

谁能告诉我下面两种放置方式的区别是什么?

我能看到视觉上的差异,但不明白为什么。

<div class="column">
<img src="//placekitten.com/100/100" alt="Forest" style="width:100%">
<img src="//placekitten.com/100/101" alt="Mountains" style="width:100%">
</div>

<div class="column">
<img src="//placekitten.com/100/100" alt="Forest" style="width:100%">
</div>
<div class="column">
<img src="//placekitten.com/100/101" alt="Mountains" style="width:100%">
</div>

这取决于column类的定义。通常div元素是块元素,但这种行为可以被CSSdisplay属性覆盖。列在一行中,因此在这种情况下,具有columnCSS类的div元素将被重新定义为内联元素或内联块元素。

第一个标记是一列,列中有两个全宽图像,由于宽度为100%,因此将垂直对齐。

第二个标记是作为列的两个元素,每个元素中有一个图像。它们可以是垂直的,也可以是水平的,这取决于column类是如何定义的。

当使用列时,你通常会用某种"row"类。

你可能想看看像Bootstrap这样的CSS框架,它会让你更容易。

相关内容

  • 没有找到相关文章