0

http://i.stack.imgur.com/ysNQV.jpg

在上面的附件中，最后一个跨度（最后一个词-“for”）有问题；它实际上超出了我的灰色区域（这实际上是带有类文本框的 div 标签）。

我真的没有得到问题。html代码也如下所示。显示的边界<span>是因为我只是想问一下，两者之间存在一些差距<span>，这是导致最后一个单词问题的原因吗？那么如何缩小这个差距呢？

<div style="left:0pt; top:0pt; width:612pt; height:792pt; position:absolute;" class="page">
      <div style="left:103.2pt; top:189pt; width:396pt; height:156pt; position:absolute; background-color:rgb(191,191,191); overflow:hidden; border:0px Solid rgb(0,0,0);" class="textFrame">
        <p style="text-align: justify; padding-top: 0pt; padding-bottom: 0pt;">
          <span class="ln" style="height: 14.4pt; width: 396pt;">
            <span style="font-size: 12pt; font-family: F0; word-spacing: 45.9943pt; width: 197.802pt; letter-spacing: 0em; text-align: left; color: rgb(0, 0, 0); border: 0.1px solid red; display: inline-block;">Subject to the</span>
            <span style="font-size: 24pt; font-family: F0; width: 64.9904pt; letter-spacing: 0em; text-align: left; color: rgb(0, 0, 0); border: 0.1px solid green; display: inline-block;">license</span>
            <span style="font-size: 12pt; font-family: F0; word-spacing: 45.9943pt; width: 133.208pt; letter-spacing: 0em; text-align: right; color: rgb(0, 0, 0); border: 0.1px solid gold; display: inline-block;">terms for</span>
          </span>
        </p>
      </div>
    </div>
4

2 回答 2

5

您为此white-space: nowrap;设置span.ln的内容将在内容到达其父元素的末尾时停止包装。除非父项已设置，否则它将突出于父项overflow: hidden;，在这种情况下，文本将被遮挡。删除white-space: nowrap;规则以允许跨度换行。您可能还会遇到奇怪的布局问题，因为内部跨度是display: inline-block;这意味着它们在某些内联内容中显示为块元素，您可能也想删除它。

除非跨度实际上在源中彼此相邻，否则任何空白都将呈现为它们之间的空间，而它们要么display: inline;是跨度元素的默认显示，要么是display: inline-block;在本示例中设置的内部跨度（样式为在元素的样式属性中可见）。要使用display: inline-block;set 消除元素之间的空间，您需要删除源中跨度之间的空白（空格、制表符和换行符）。

于 2012-10-11T12:28:28.673 回答
1

就我个人而言，对我有用的东西，我给了父元素一个“自动换行：断词”，并为子跨度元素指定了宽度。

于 2016-07-20T22:51:50.277 回答