css中如何设置两个图片之间的距离

如题所述

1、css设置图片距离可以用盒子模型的margin属性。操作方法首先用html编辑器新建一个html文件,里面放入几张图片:

2、然后在上方的style中设置css的样式,设置img的margin属性为“0 30px”即可,其中前一个数字表示上下的距离,后一个数字表示左右的距离。最后在调整统一一下图片的大小,方便观察效果:

3、最后打开浏览器,就会看到2张图片之间是有距离的效果了:

温馨提示:内容为网友见解,仅供参考
第1个回答  推荐于2017-09-04

CSS 框模型 (Box Model) 规定了元素框处理元素内容、内边距、边框 和 外边距 的方式。所以两个图片之间的距离可以用外边距(margin)来实现:

margin: top right bottom left;

示例:假设页面中放置了2行共6张图片

<img src="1.png" alt="example"><img src="1.png" alt="example"><img src="1.png" alt="example"><br>
<img src="1.png" alt="example"><img src="1.png" alt="example"><img src="1.png" alt="example">

    如果通过css设置图片边距为零,则效果如下

img{margin:0;}

    如果通过css设置图片各个方向的距离相等为10px,则效果如下

img{margin:10px;}

    如果通过css设置图片不等距离:上下20px,左右10px,则效果如下

img{margin:20px 10px;}

第2个回答  2015-05-21
可以通过内边距和外边距来设置
分别是padding和margin

css中padding和margin的区别

margin 外边距
border 边框
padding 内边距
也就是说 设置margin 那么他所占据的空白地方会是在边框外面
设置padding 他所占据的空白地方是在边框里面
第3个回答  2012-03-06
有许多办法,图片可以放在div也可以放在table也可以放在ul、ol,可以用margin也可以用padding调节距离,也可以用clear:both清除两边,想学更多,你找我啊,我只要会的就告诉你。本回答被网友采纳
第4个回答  2012-03-05
img{padding:5px;}

css中如何设置两个图片之间的距离
1、css设置图片距离可以用盒子模型的margin属性。操作方法首先用html编辑器新建一个html文件,里面放入几张图片:2、然后在上方的style中设置css的样式,设置img的margin属性为“0 30px”即可,其中前一个数字表示上下的距离,后一个数字表示左右的距离。最后在调整统一一下图片的大小,方便观察效果:3、最...

css如何设置两个图片的边距?
CSS 框模型 (Box Model) 规定了元素框处理元素内容、内边距、边框 和 外边距 的方式。所以两个图片之间的距离可以用外边距(margin)来实现:margin: top right bottom left;示例:假设页面中放置了2行共6张图片 如果通过css设置图片边距为零,则效果如下 img{margin:0;} 如果通过css设置图片各个方向...

两个图片间的行距的代码是什么?急急急
把两张图片之间的换成一个就可以了,P标签是段落标签,会有一个空行.如果还有问题欢迎追问,问题解决请及时选为满意回答,谢谢.

什么是图片的间距?有几种?如何实现
在css中,设置两个图片之间的距离,主要使用margin属性来设置,可以实现对图片上下左右的外边距进行控制。在word2010中段落间距有段前和段后间距两种,行间距有单倍行距、1.5倍行距、2倍行距、最小值、固定值、多倍行距六种。

HTML代码,怎么处理图片和图片之间的距离,求详细步骤,谢谢
有两种方法:一、利用无序标签ul li来实现,基本语法及格式如下: CSS样式如下:.pic{float:left; text-decoration:none;padding-left:10px;} 二、利用div标签也可实现 <

HTML 图片和图片间距用什么代码
这个是浏览器的一个设计问题。img本来是行内元素,却可以用width 和height,当父元素没有设置高度的时候,用子元素们的高度计算出的高度给父元素的时候就会出现3px空隙这类的问题。img图片默认排版为 inline-block;而所有的inline-block元素之间都会有空白。

css 和之间的距离远近怎么调整?
和之间的距离远近可以通过外边距来设置 margin: 10px 5px; \/* 设置上下边距10px,左右边距5px*\/举个例子 创建HTML元素 我是第一段呀我是第一段。我是第二段呀我是第二段啊我还是第二段。

如何在CSS中将背景图片距离左边XXX像素
CSS:div{background:url(..xx.jpg) no-repeat 10px center} 背景为xx.jpg,不重复,距离左边10px距离,上下居中显示

想让两个图片保持在标签的两端,可以怎样设置
具体设置步骤如下:1、新建一个html文档,在body中新建两个div,一个是class属性为aa的div,另一个是class属性为bb的div。2、在文件内,在两个div内分别加上一个图片标签img,并且写上两张图片的路径。3、在html文件内,使用css对两个div的样式进行定义,分别设置其position属性为absolute,即两张...

图片和字符之间的间距怎么处理?html的
有好几种方法可以解决:1、调整全站的图片CSS,即在CSS当中,增加:img{margin:10px 0;},意思即为图片上下增加10像素距离。2、调整文字的CSS,即在CSS当中,增加:p{ padding-top:10px;},意思即为段落文字前,增加10像素的间隔。3、最简单的办法,输入文字前,敲上一个回车键,增加一行即可。

相似回答