Firefox 和 IE 中的表格边框与 Chrome 中的不同答案

【问题标题】：Table border not the same in Firefox and IE as in ChromeFirefox 和 IE 中的表格边框与 Chrome 中的不同
【发布时间】：2013-03-09 23:01:10
【问题描述】：

我的网站http://www.matejkadesign.com 无法在 Chrome、IE 和 Firefox 中显示一致样式的外部表格边框。我想要的样式在 Chrome 中，但在其他两个浏览器中都不同。我一直在寻找修复，但没有找到。我不在 CSS 中设置表格样式，而是在 html 中这样做：

<table align="center" cellspacing="5" cellpadding="5" border="4" bordercolor="#3c2610" width="310px" >

这似乎会产生三种不同的效果。如何使 Firefox 和 IE 的样式与 Chrome 中的样式相同？

【问题讨论】：

【解决方案1】：

您需要使用内联样式有什么特别的原因吗？

您可以通过为table 和td 标签定义精确的border 样式来修复这些行为，这样做可以防止浏览器应用自己的样式。

试试这个：

table {
    border: 4px solid #3C2610;
}

td {
    border: 1px solid #3C2610;
}

【讨论】：

【解决方案2】：

你有一个 HTML before 你的文档类型，它将触发 IE 进入怪癖模式（相当于 IE5）。 IE 基本上会解析您的文档，就好像它没有文档类型一样。 <!DOCTYPE html>

其次，您使用的是 HTML 4.01 中已弃用的表格属性，但您在技术上声明了 HTML 5 文档类型。这两个原因很可能解释了浏览器之间的差异。

您还在整个站点中多次使用已弃用的align 属性.. 如果您坚持使用 HTML 4.01 属性，至少更改您的文档类型以匹配它：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

【讨论】：