首页 文章

如何在CSS中表示双单元格格式？

提问于
浏览 次
1

我一直有这个问题了 .

无论如何，鉴于此代码：

<table>
<tr>
    <td><img src="" /></td>
    <td valign="middle">Text</td>
</tr>
</table>

这将呈现一个左侧有图像的格式，右侧有一些垂直居中的文本 . 这是有效的，因为那时我可以有多行文本，并且仍然可以“很好地”定位图像 .

现在，理想情况下，表格只应用于表格数据，是吗？那么如何在CSS中表示这一点呢？

我在想 <div> 标签？但是我将整个位封装在一个带有style = "display: table; border: 1px solid black;"的 <p> 框中，我担心相对定位的div可能最终会突然出现，需要调整，我不喜欢在CSS中做...

救命！

html css html-table

3 回答

  • 1

    HTML：

    <div id="container">
<img src="..." />
<p>text</p>
</div>

    CSS：

    #container {
 width: 200px;
}

#container img, #container img{
 width: 100px;
 float: left;
}
    回复于
  • 0
    <div style="vertical-align: middle;">
 <img style="float:left;" src="" alt="" />
 <p>Your text</p>
</div>
    回复于
  • 1

    你正在使用什么标签并不重要（特别是在css重置后） . 你只需要将包装器标签 display: table; 和嵌套的单元格标签设置为 display: table-cell; 之后就可以使用 vertical-align 你也可能需要在你的内容周围添加更多的标签来重新创建一个真正的表格，whit表格行 .

    回复于

相关问题