为什么“科尔斯潘”在我的表格中不起作用

why "colspan" does not work in my table

本文关键字：我的 表格 不起作用 科尔斯潘 为什么      更新时间：2023-09-26

我在jsfiddle中制作了一个简单的表格形式。

我也把我的代码放在这里：

<table>
     <tr>
        <td class="field_label">name</td>
        <td>*</td>
        <td>
         <input type="text">
        </td>
        <td>
         <input type="text">
        </td>
      </tr>
      <tr>
        <td>email</td>
        <td>*</td>
        <td colspan="2">
           <input type="text"> 
        </td>
      </tr>
</table>

两个问题：

1.如您所见，我在email输入字段中使用colspan="2" <td>以使文本字段长度与占用两列的name字段相同，但它不起作用，为什么？

2. 如何在输入字段中设置默认值并将默认值颜色设置为灰色？

关于问题 1.：保存第二个表格行输入的列将有 2 列长(如您所看到的是否显示表格列的边框(; 但是，输入字段在每个浏览器中都有一个默认宽度 - 这意味着输入将以与上面的输入完全相同的宽度显示; 这就是为什么您可能认为colspan不起作用的原因。

在 input 标签中添加一个 size 属性，或者添加一个 width css 属性，例如：

<table>
 <tr>
    <td class="field_label">name</td>
    <td>*</td>
    <td><input type="text"></td>
    <td><input type="text"></td>
  </tr><tr>
    <td>email</td>
    <td>*</td>
    <td colspan="2"><input type="text" style="width:99%;" ></td>
  </tr>
</table>

对于 2.，可以使用 value 属性设置输入的默认值：

<input type="text" name="ID" value="101" />

如示例中所示，您还应该至少使用 name 属性(以便能够引用来自 JavaScript 或 PHP 的输入(;并且要使其 html5 有效，您应该使用 /> 关闭标记(因为您没有单独的结束</input>标记(。

更改文本颜色可以通过添加CSS样式来完成;无论是在输入本身中，还是通过id或class属性;例如，以下内容将使输入中的文本颜色浅灰色：

<input type="text" style="color:#CCC;" >

请务必查看如何指定一般的CSS样式(例如内联，或按id或类(，以及如何使用CSS指定颜色。

将style设置为 display:block 也会破坏 colspan 属性。

改为将style设置为display:table-cell，或者不设置display样式。

这是你想做的吗？

  • 实际上，它有效但没有显示，因为您的宽度不是100%.
  • 要在输入值中添加默认文本，可以使用输入的 value 属性，例如：<input type="text" value="Default text">
  • 您可以像任何其他元素一样设置输入框的样式，例如：<input type="text" style="color: #FFFFFF; background-color: #C0C0C0;">

2. 如何在输入字段中设置默认值并将默认值颜色设置为灰色？ 

<input type="text" value=2> -- for setting default value
<TD bgcolor=##030303> --- For coloring
相关文章：