简体   繁体   English

如何为不同的浏览器在html表格单元格中填充html中的背景色

[英]How can I fill an html table-cell with a background-color in html for difference browsers

I have the following piece of HTML that creates a table with a scrollbar at the last column. 我有以下一段HTML,该段HTML创建了一个在最后一列带有滚动条的表。 My problem is that IE renders it differently than Firefox. 我的问题是IE呈现的方式与Firefox不同。 Any clue would be greatly appreciated. 任何线索将不胜感激。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Test of tables and CSS</title>
<style type="text/css">
td
{
   border:solid 1px #000000;
   padding:2px 2px 2px 2px;
    }
</style>
</head>
<body>
<table cellspacing="0" style="border:solid 1px #000000;border-collapse:separate;padding:0 0         0 0;">
<tr>
<td>Col 1 1</td>
<td>Col 1 2</td>
<td rowspan="5" style="width: 1px; padding: 0 0 0 0;height:100%;"><table cellspacing="0" style="border: none; height:100%;border-collapse: collapse; padding: 0 0 0  0;">
<tr><td style="border: none; height: 1px; background-color: #C9D8FC;"><img alt="" src="../img/ico/ScrollUp.gif" style="border: none;" /></td></tr>
    <tr><td style="border: none; height: auto; background-color: #C9D8FC;"></td></tr>
<tr><td style="border: none; height: 1px; vertical-align: bottom; background-color:#C9D8FC;"><img alt="" src="../img/ico/ScrollDown.gif" style="border:none;" /></td></tr>
</table></td>
</tr>
<tr>
<td>Col 2 1</td>
<td>Col 2 2</td>
</tr>
<tr>
<td>Col 3 1</td>
<td>Col 3 2</td>
</tr>
<tr>
<td>Col 4 1</td>
<td>Col 4 2</td>
</tr>
<tr>
<td>Col 5 1</td>
<td>Col 5 2</td>
</tr>
</table>
</body></html>

Firefox: Firefox:
替代文字

IE 8: IE 8:
替代文字

height: auto; 高度:自动; this is not working correctly in IE, 这在IE中无法正常工作,

try adding display: block 尝试添加显示:块

Is this the problem? 这是问题吗?

vstyle="... should be style="... 

also you might want to add a class to your tables instead of putting the styles inline, it makes it easier to read but won't make a difference in the rendering 您也可能想在表中添加一个类,而不是将样式内联,这使它更易于阅读,但不会对渲染产生任何影响

You could use conditional comments in your header to send specific style declarations to internet explorer? 您可以在标题中使用条件注释,以将特定的样式声明发送到Internet Explorer?

<!--[if IE]>
Only IE will output what's between these brackets, style declarations etc.
<![endif]-->

Read More 阅读更多

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM