css两张并排图片间隔

admin 轻心小站 关注 LV.19 运营
发表于前端技术学习版块 css,教程

CSS是网页设计中不可缺少的一部分。有时我们想要在网页中放置两张图片并排,但是图片间隔不够美观,这时我们可以使用CSS来解决这个问题。首先,我们需要在HTML文档中放置两张图片:<img

CSS是网页设计中不可缺少的一部分。有时我们想要在网页中放置两张图片并排,但是图片间隔不够美观,这时我们可以使用CSS来解决这个问题。

首先,我们需要在HTML文档中放置两张图片:

<img src="image1.jpg">
<img src="image2.jpg"> 

接下来,我们给这两张图片添加CSS样式:

img {
  display: inline-block; /* 将图片转为行内块元素 */
  margin-right: 10px; /* 设置图片右边距为10px */
} 

上面的代码中,我们使用了display属性将图片转为行内块元素,这样两张图片会并排排列。然后设置了margin-right属性来控制图片之间的间隔。

现在,这两张图片就会有一个美观的间隔了。

文章说明:

本文原创发布于探乎站长论坛,未经许可,禁止转载。

题图来自Unsplash,基于CC0协议

该文观点仅代表作者本人,探乎站长论坛平台仅提供信息存储空间服务。

评论列表 评论
发布评论

评论: css两张并排图片间隔

粉丝

0

关注

0

收藏

0

已有0次打赏