为了账号安全,请及时绑定邮箱和手机立即绑定

块状元素转化的内联元素之间的间距去哪了?222222222222222222222与222222222222222222222之间应该有间距不是么?

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>行内元素标签</title>

<style type="text/css">

a,span,em{

background:pink;/*设置a、span、em标签背景颜色都为粉色*/

    display:block;

    display:inline;

}

p{display:inline;}

</style>

</head>

<body>

<p>222222222222222222222</p><p>222222222222222222222</p><p>222222222222222222222</p><p>222222222222222222222</p>

<a href="http://www.baidu.com">百度</a>

<a href="http://www.imooc.com">慕课网</a>

<span>33333</span>

<span>44444</span><em>555555</em>

</body>

</html>

http://img1.sycdn.imooc.com//587073870001c56c03860059.jpg

正在回答

4 回答

这问题是回车造成的,你把

<p>你好世界</p><p>我的世界</p>
<p>再见世界</p>

删去回车变成

<p>你好世界</p><p>我的世界</p><p>再见世界</p>

间隔就会消失。


ps:类似的问题,比如两张图片放一起,也会因为这个回车造成两张图片有间隔的问题。这时还分浏览器!不同的浏览器有时你删掉回车两图片就没间隔了,有的删了也没用,这时这里用别的办法比如把有关间距设置为负值(有时设置为0还不行)

0 回复 有任何疑惑可以回复我~

http://img1.sycdn.imooc.com//589549c00001074109530486.jpg应该是在一行的原因吧,我的这幅图中你好世界我的世界之间是没有间隔的,而再见世界是有间隔的,下面的百度跟慕课网是有间隔的,而444455555之间是没有间隔的

0 回复 有任何疑惑可以回复我~
#1

律生息 提问者

所以说原因是什么捏?你只是说了现象,现象我在问题中已经提出来了,问题还是没有解决不是么?
2017-02-07 回复 有任何疑惑可以回复我~

内联元素特点:

1、和其他元素都在一行上;

2、元素的高度、宽度及顶部和底部边距不可设置;

3、元素的宽度就是它包含的文字或图片的宽度,不可改变。


0 回复 有任何疑惑可以回复我~
#1

律生息 提问者

后面还有一句话,,,, 小伙伴们你们观查一下右侧代码段,有没有发现一个问题,内联元素之间有一个间距问题 所以说这个间距去哪了?
2017-02-03 回复 有任何疑惑可以回复我~

......

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

块状元素转化的内联元素之间的间距去哪了?222222222222222222222与222222222222222222222之间应该有间距不是么?

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信