对齐使用CSS图像列表 [英] Align list of images using CSS

查看:631
本文介绍了对齐使用CSS图像列表的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想调整图像以自下而上的名单,我怎么能做到这一点使用CSS?

I would like to align a list of images to 'bottom', how can I achieve this using CSS?

背景:我想了一组照片对齐底部,图像可在不同尺寸

Background: I want a set of photos to be aligned to the bottom, the images are in different sizes.

<div>
  <ul>
    <li> <!-- image 1-->
    <li> <!-- image 2-->
    <li> <!-- image 3-->
  </ul>
</div>

感谢。

推荐答案

这一切绝对定位的问题是,李的元素不会有任何的高度,由于图像元素是绝对的,不推任何布局了。通常这是一个不好的解决办法。

The problem with all this absolute positioning is that the li elements will have no height, since the image element is absolute and doesn't push any layout anymore. typically that's a bad solution.

根据你所需要的,这可能是工作:

li {
  display: inline;
  vertical-align: bottom;
}

在这里活生生的例子: http://mooshell.net/zBCGW/

这篇关于对齐使用CSS图像列表的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆