Question

就像表格

一样

TD WIDTH 25    TD WIDTH 75

这是我想用DIV / SPAN实现的目标。我只有：

  <span style="background-color: green; width: 25%; display: inline-block;">1</span>
  <span style="background-color: yellow; width: 75%; display: inline-block;">2</span><br />
  <span style="background-color: green; width: 25%; display: inline-block;">a</span>
  <span style="background-color: yellow; width: 75%; display: inline-block;">b</span><br />

然后将跨度换成新行。它适用于修复（px）尺寸。

Answer 1

使用float

  <span style="background-color: green; width: 25%; float:left;">1</span>
  <span style="background-color: yellow; width: 75%; float:right;">2</span><br />
  <span style="background-color: green; width: 25%; float:left;">a</span>
  <span style="background-color: yellow; width: 75%; float:right;">b</span><br />

Answer 2

问题在于两个跨度之间的空白。

<span style="display:inline:block; width:25%">..</span>
<span style="display:inline:block; width:75%">..</span>

它们之间有一个空格，所以整个东西不适合100％;它是100％加上宽度的宽度如果删除两个跨度之间的换行符，它将起作用。

<span style="display:inline:block; width:25%">..</span><span etc...>

跨度百分比宽度

2 个答案: