css如何让三张图片在一行里显示?

html-css011

css如何让三张图片在一行里显示?,第1张

三个div代表上中下,上面用个div包裹一个div和一个ul,中间div里也是两个div表示上下两部分,这两部分里面又分左右两个div。最下的div里弄个P标签就行了。

让三张图在一行可以设置float:left或者float:right就行

这里提供两种方法:

1.每3个就在后面加上<br><br>,注意是两个br这样就换行了。

2.用css来实现,控制.goods的宽度。

一般为33%,不知道你的.goods类是怎么写的,如果有margin的话就要比33%小一点。

具体代码:

<style>

* {

margin: 0

padding: 0

}

.goods {

border: 1px solid #ccc

height: 100px

width: 33.333%

float: left

     box-sizing:border-box

     padding:10px

}

</style>

<div class="goods">1</div>

<div class="goods">2</div>

<div class="goods">3</div>

<div class="goods">4</div>

<div class="goods">5</div>

<div class="goods">6</div>