小编Men*_*mer的帖子

一些HTML代码:

<p id='one'>Hello World how are you.&nbsp;<span>Entrepreneur</span></p>

<p>Hello World how are you.&nbsp;<span>Entrepreneur</span></p>

一些CSS:

#one span {
  display: inline-block;
}

p {
  font-family: Arial;
  font-size: 16px;
  width: 200px;
}

第二段表现得像我期望的那样.

然而,第一个行为不同,因为跨度是内联块.

我的问题是,为什么inline-block跨度忽略了 和span前一个词之间的断开线？

谢谢!

这里举例说明.

拿这个简单的HTML:

#parent {
  background: pink;
}

#child {
  width: 5000px;
}

<div id="parent">
  <div id="child">Hello</div>
</div>

该#parent元素的粉红色的背景并不在整个坚持#child元素.为什么是这样？

在body元素上设置背景确实适用于整个#child,即使#parent并且body共享相同的宽度,即视口宽度.

奇怪的是,设置#parent元素的显示来inline-block 修复这个问题,虽然我不明白为什么!

这里的任何帮助将不胜感激:)