CSS display:table-cell 不适用于输入元素

在本文中，我们将介绍CSS中的display:table-cell属性以及它在输入元素上的不适用情况。

阅读更多：CSS 教程

什么是display:table-cell属性

在CSS中，display:table-cell属性用于将元素呈现为表格单元格。当将此属性应用于一个元素时，该元素将被视为表格的单元格，具有表格特性。

display:table-cell和输入元素

然而，尽管display:table-cell属性在大多数元素上都可以正常工作，却不适用于所有类型的元素，特别是在输入元素上。

输入元素（如input、textarea和select）不会受到display:table-cell属性的影响。无论如何设置display属性，输入元素始终显示为行内块元素。

示例说明

以下是一个示例，说明display:table-cell属性在输入元素上的不适用情况。

<div style="display: table;">
  <div style="display: table-row;">
    <div style="display: table-cell;">
      <input type="text" value="This is an input element">
    </div>
    <div style="display: table-cell;">
      <button>Submit</button>
    </div>
  </div>
</div>

在上面的示例中，我们尝试将输入元素包含在具有display:table-cell样式的div中。然而，无论我们如何设置display属性，输入元素仍然以行内块元素的形式显示。