JS 设置图片边距教程

 时间:2026-05-10 22:17:01

1、首先我们要创建一个示例的HTML页面,代码及运行效果如图

JS 设置图片边距教程

JS 设置图片边距教程

2、接下来我们要利用JS的document对象获取我们需要修改样式的元素,如图我们获取到了两张图片。

JS 设置图片边距教程

JS 设置图片边距教程

3、我们通过修改获取到的元素的样式的外间距就可以修改图片的外间距。

格式示例:target.style.marginTop = '20px',

代码及示例如图

JS 设置图片边距教程

JS 设置图片边距教程

4、我们还可以修改整个元素的外间距,代码及示例如图

JS 设置图片边距教程

JS 设置图片边距教程

5、同理,我们可以用这个办法修改图片的内间距,代码及示例如图

JS 设置图片边距教程

JS 设置图片边距教程

6、总结,修改图片间距的教程还是很简单的,重点是希望大家能够通过这个示例掌握使用JS修改元素样式的方法

  • HTML中引入css和js的方法
  • div设置字体颜色
  • 在css中如何设置左浮动和右浮动?
  • 如何居中div里面的table
  • html字体设置微软雅黑
  • 热门搜索
    上海旅游必去景点 广东省旅游学校 去西藏旅游要多少钱 吉隆坡旅游攻略 杭州千岛湖旅游攻略 四川旅游学校 旅游酒店 旅游景区质量等级的划分与评定 吉安旅游 旅游活动