html怎么让图片并排显示

html-css019

html怎么让图片并排显示,第1张

一、是用表格元素,对每张图片进行定位。<table><tr><td><img src=pic1.jpg border=0></td><td><img src=pic2.jpg border=0></td></tr></table>二、使用有序列表<li></li>列表,通过自定义样式实现多元素同行显示。css样式定义每个<li>在父元素宽度上做整除,即可同行显示所有元素。

亲,这个答案是可以的,不过有一点需要说明的是,两张图片家里来的宽度不能超过设定的页面宽度,比如说你的页面宽度为980像素,那么你的两张图片的宽度就不能超过980,否则就不能。

图片并排列

需要补充的是如果图片超出了最大的范围,可以使用img的属性设置宽度来使图片同一行排列。

<div style="width:150pxheight:260pxposition:absolute">

<div style="width:100%border:1px solid redheight:200px">

图片

</div>

<div style="width:100%margin-top:10pxborder:1px solid redheight:50px">

文字

</div>

</div>

<div style="width:150pxheight:260pxposition:absolutemargin-left:160px">

<div style="width:100%border:1px solid redheight:200px">

图片

</div>

<div style="width:100%margin-top:10pxborder:1px solid redheight:50px">

文字

</div>

</div>

<div style="width:150pxheight:260pxposition:absolutemargin-left:320px">

<div style="width:100%border:1px solid redheight:200px">

图片

</div>

<div style="width:100%margin-top:10pxborder:1px solid redheight:50px">

文字

</div>

</div>

<div style="width:150pxheight:260pxposition:absolutemargin-left:480px">

<div style="width:100%border:1px solid redheight:200px">

图片

</div>

<div style="width:100%margin-top:10pxborder:1px solid redheight:50px">

文字

</div>

</div>