html5中如何让四张图片分成两行两列

html5中如何让四张图片分成两行两列,第1张

排列。首先要排列四张照片放置到同一个文件夹中并打开电脑中运行html的软件,其次点击界面中的文件编辑栏选择排列点击浮点排列,最后在d出的页面中点击四张图片并将排列行数设定为两行即可。

把图片调小,然后设置:

background-repeat: repeat

或者直接在css里设置背景图的大小:

background-size:50%

这样背景图片就可以排成两列 了

并排放置的方法有很多。

简单的可以考虑直接放置2张图片,因为img是内联元素。

也可以考虑用table实现,在2个单元格当中放置图片,并设置垂直对齐方式。

如果使用css样式实现,可以考虑用float,flex,grid等排列方式。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7005984.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-31
下一篇 2023-03-31

发表评论

登录后才能评论

评论列表(0条)

保存