这是我当前的代码:
<figure class="half">
<img style="width:400px" src="http://alexmarshall12.github.io/assets/img/colored_1693146.png">
<img style="width:600px" src="http://alexmarshall12.github.io/assets/img/one-piece-1693146_colored2.png">
<figcaption>Caption describing these two images.</figcaption>
</figure>
不幸的是,也许是因为图像太宽,它仍将第二个图像放在下一行。我想避免这种情况-不管事情变得多么广泛。我怎样才能做到这一点?
只需display:flex
在您的案例图中将css添加到图像的父容器中即可。
<figure class="half" style="display:flex">
<img style="width:400px" src="http://alexmarshall12.github.io/assets/img/colored_1693146.png">
<img style="width:600px" src="http://alexmarshall12.github.io/assets/img/one-piece-1693146_colored2.png">
<figcaption>Caption describing these two images.</figcaption>
</figure>
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句