用css如何使3张图片左右两边置顶,之间间距等宽?

发布网友发布时间：2022-04-25 00:05

我来回答

共4个回答

懂视网时间：2022-05-13 23:19

每个图片块左浮动,宽30%,左外边距2.5%:
100%=(2.5%+30%)+(2.5%+30%)+(2.5%+30%)+2.5%

三列图片等宽布局

简单实用的百分比布局还是很适合手机WAP页面布局的:
min-width:320px;
max-width:420px;
width:100%;
overflow-x: hidden;
margin: 0 auto;
最小宽度320px,最大宽度420px,在320px和420px之间自动适应宽度,看起来还行.
在标签里只用设置width属性百分比值,比如width="40%",不用设置height属性,这样图片能够自行按原比例缩放.
容器里面的块,同样可以用百分比布局,比如左边的60%,右边的40%,就算是图片,在合理范围内,拉伸宽,影响也不大.

热心网友时间：2022-05-13 20:27

.img1{ position:absolute; left:0; top:0}
.img2{ position:absolute; left:50%; top:0, margin-left:图片宽/2} 或 {margin:0 auto;}

.img3{ position:absolute; right:0; top:0}

热心网友时间：2022-05-13 21:45

左右两张分别浮动中间按百分比设置宽度

热心网友时间：2022-05-13 23:19

给img的父标签加上margin:0 10px; 也可以margin-left:10px; 或者margin-right:10px;
数字我随便给你你自己根据需要给多少