css3 图片边距 |怎么用css写响应式

img {
margin: 10px;
}
/*
* 上面这段代码会在图片周围添加10像素的间距
* margin属性用于定义元素外部空白区域
*/

在应用CSS3 图片边距属性之前，你需要为你的图片设置一个class或者ID。例如：

<img src="example.jpg" alt="example" class="example-img">

然后就可以使用CSS3 图片边距了。

CSS3 图片边距有四个方向的属性：上(margin-top)、右(margin-right)、下(margin-bottom)、左(margin-left)。如果需要为每个方向设置不同的大小，可以像下面这样设置：

.example-img {
margin: 20px 10px 5px 15px;
}
// 上20px 右10px 下5px 左15px

你也可以只设置一个方向的边距：

.example-img {
margin-top: 20px;
margin-bottom: 10px;
}
// 上20px 底部10px

除了使用固定尺寸的像素值，还可以使用百分比或em作为单位：

.example-img {
margin: 5% 2em;
}
// 上下5% 左右2em

使用CSS3 图片边距需要注意的是，它会影响整个布局，因此需要谨慎使用。在选择图片边距大小时，需要考虑到网页的整体设计，并设置适当的间距来优化用户体验。