html – div漂浮在桌子上

我试图让一个div漂浮在一张桌子上,所以它将在所有文本之上？

解决方法

查看 absolute positioning,也可能是 z-index(虽然这是您唯一的绝对定位内容,但您不需要它).虽然还有其他方法可以让事情重叠,但这可能与您最相关.

很简单的例子：

CSS：

#target {
  position: absolute;
  left: 50px;
  top: 100px;
  border: 2px solid black;
  background-color: #ddd;
}

HTML：

<p>Something before the table</p>
<div id="target">I'm on top of the table</div>
<table>
  <tbody>
    <tr>
      <td>Text in the table</td>
      <td>Text in the table</td>
    </tr>
    <tr>
      <td>Text in the table</td>
      <td>Text in the table</td>
    </tr>
    <tr>
      <td>Text in the table</td>
      <td>Text in the table</td>
    </tr>
    <tr>
      <td>Text in the table</td>
      <td>Text in the table</td>
    </tr>
  </tbody>
</table>

Live copy | source