HTML中怎样敲出图片并排的样式代码

2024-10-15 21:49:31

1、先准备好图片,然后建立图片标签,如图所示;对图片外面的div添加一个宽,将图片宽度和div的宽度设置成一样100%

HTML中怎样敲出图片并排的样式代码

2、这样显示的图片就是只在规定的div中显示

HTML中怎样敲出图片并排的样式代码

3、如果有多张图片,可以直接对div进行复制多个

HTML中怎样敲出图片并排的样式代码

4、如果默认情况下,因为是div是块状标签,所示默认是上下排列的,如图所示

HTML中怎样敲出图片并排的样式代码

5、这时候给div添加一个浮动效果就可以了

HTML中怎样敲出图片并排的样式代码

6、如图所示,这样复制的几个图片就全部变成横排的样式了

HTML中怎样敲出图片并排的样式代码

7、如果觉得图片紧挨着太近,可以对每个div添加一个外边距margin

HTML中怎样敲出图片并排的样式代码

8、这样每个图片就会出现间隙了,是不是很简单的代码。

HTML中怎样敲出图片并排的样式代码
猜你喜欢