向没有样式的表添加输入

Question

我正在向表格td添加输入，但我想以与简单单元格相同的方式显示它。这是我的代码：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<table id="table">
  <thead>
    <tr>
      <td>Some Text</td>
    </tr>
  </thead>
  <tbody id="Body">
    <tr>
      <td><input disabled style="with:100%;" value="data" /></td>
    </tr>
  </tbody>
</table>

简单来说，我希望将其显示为文本，而不是显示边框和背景。我尝试添加outline: none但没有任何事情发生。

Answer 1

修复样式需要做的3件事：

1. 使用border: none
删除边框
2. 使用background: none
删除背景
3. 添加color: initial以删除来自已禁用输入的灰色颜色

工作代码段

＆＃13;
＆＃13;
input {
  border: none;
  background: none;
  color: initial;
}
＆＃13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<table id="table">
  <thead>
    <tr>
      <td>Some Text</td>
    </tr>
  </thead>
  <tbody id="Body">
    <tr>
      <td>
        <input disabled style="with:100%;" value="data" />
      </td>
    </tr>
  </tbody>
</table>
＆＃13;
＆＃13;
＆＃13;