使用css排列图像列表

时间:2010-07-12 21:15:25

标签: html css

我已经从其他网站获取了div元素,感谢这个群组。

require_once('E:\wamp\www\in.com\components\simple_html_dom.php');


$html=file_get_html('http://www.behance.net/samerh/frame');
$ret=$html->find("div[id=frame-gallery]");
$ret=array_shift($ret);
echo($ret);

该div中的内容是所有图像,它显示在一个列表中,而我想通过为其编写css和js文件将其排列为3列和10行。

它应该是动态的,就像添加项目的任何新图像或在该网站中进行的任何更改一样,它应该显示在我当前的网站中。

请帮我告诉我如何在css中安排,

提前致谢。

1 个答案:

答案 0 :(得分:0)

我同意所作的评论。学会接受您找到的解决问题的答案(如果您不知道,请通过点击投票计数下方的复选标记接受答案)。但是,我会怜悯你。

此解决方案假设图像宽度相同,为了便于说明,我会说100px宽。你的CSS可能是:

#frame-gallery {width: 330px;}
#frame-gallery img {float: left; margin: 0 10px 10px 0;}

这应该将它们排列成3列,间距为10px,然而,无论加载了多少图像,都需要很多行。将width的{​​{1}}更改为恰好适合3张图片的#frame-gallery以及正在应用的任何边距,填充,边框等。