gpt4 book ai didi

html - Chrome 特定的 CSS 问题设置表单元格显示 :block

转载 作者:太空狗 更新时间:2023-10-29 14:39:48 26 4
gpt4 key购买 nike

我找到了 this question似乎有我想要的东西。我正在使用 chrome 32.0.1700.102 甚至 fiddle在第一个答案上,对我来说效果很好。

但是,当我将以下 html 放入一个新文件并在 chrome 中打开它时,tds 的“计算样式”选项卡仍然显示 display:table-cell; :

<html>
<head>
<style>
#block td {
display: block;
background: #ccc;
}
</style>
</head>
<body>
<table>
<tr>
<td>a</td>
<td>b</td>
<td>c</td>
<td>d</td>
</tr>
</table>

<table id="block">
<tr>
<td>a</td>
<td>b</td>
<td>c</td>
<td>d</td>
</tr>
</table>
</body>
</html>

当我在 firefox 中打开它时,我得到了想要的结果:

firefox vs chrome

这是 chrome 的屏幕截图,在样式选项卡中显示了 display:block 规则,但在计算选项卡中显示了 table-cell:

enter image description here

最佳答案

我没有看到任何 DOCTYPE在文档中声明,当您不声明文档类型时,Chrome 会覆盖 display: block;display: table-cell;

它适用于 JS Fiddle,因为它们声明了文档类型。

所以使用<!DOCTYPE html>在文档的最顶部 <html> 之前它应该可以解决问题。

关于html - Chrome 特定的 CSS 问题设置表单元格显示 :block,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21425138/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com