3

请帮帮我

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>
    <body style="margin: 0px; padding: 0px;">
        <table style="width: 600px;">
            <tr>
                <td rowspan="2" style="background: #FF0;">Left<br/><br/><br/><br/><br/><br/><br/><br/><br/>&nbsp;</td>
                <td colspan="2" height="30px" style="background: #FCC;height: 30px;">header</td>
            </tr>
            <tr>
                <td>Content</td>
                <td style="background: #EEE;">Right</td>
            </tr>
        </table>        
    </body>
</html>

它在 Firefox 或 chrome 中工作正常，但 IE 忽略高度属性和带有文本标题的单元格的高度不正确。如何解决？

演示：小提琴

4

4 回答 4

2

使用 td 内的元素设置高度，如下所示：

<div style="display:block;height:30px;">header</div>
于 2013-02-05T12:02:44.467 回答
0

试试这个代码：

 <!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 </head>
 <body style="margin: 0px; padding: 0px;">
    <table style="width: 600px; height:500px">
        <tr>
            <td rowspan="2" style="background: #FF0;">Left</td>
            <td colspan="2" height="80px" style="background: #FCC;">header</td>
        </tr>
        <tr>
            <td>Content</td>
            <td style="background: #EEE;">Right</td>
        </tr>
    </table>        
</body>
</html>
于 2013-02-05T12:02:17.237 回答
0

html 5 不再支持 height 并且在 html 4 中已弃用 由于您使用的是 html5 我建议使用

样式=“高度：30px；”

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 </head>
 <body style="margin: 0px; padding: 0px;">
    <table style="width: 600px; height:500px">
        <tr>
            <td rowspan="2" style="background: #FF0;">Left</td>
            <td colspan="2" style="height:30px;background: #FCC;">header</td>
        </tr>
        <tr>
            <td>Content</td>
            <td style="background: #EEE;">Right</td>
        </tr>
    </table>        
</body>
</html>

参考http://www.w3schools.com/tags/att_td_height.asp

于 2013-02-05T12:09:07.407 回答
-1

我认为转换为 DIV 和 CSS 会很好：

<style>
    #leftPanel {
        background: #FF0;
        float: left;
        width: 135px;
    }
    #headerPanel {
        background: #FCC;
        height: 30px;
    }
    #contentPanel {
        float: left;
    }
    #rightPanel {
        background: #EEE;
        float: right;
        width: 200px;
        height: 150px;
    }
    #containerPanel {
        width: 600px;
    }
</style>

<div id="containerPanel">
    <div id="leftPanel">
    Left<br/><br/><br/><br/><br/><br/><br/><br/><br/>&nbsp;
    </div>
    <div id="headerPanel">
        header
    </div>
    <div id="contentPanel">
        Some content here...
    </div>
    <div id="rightPanel">
        Right
    </div>
</div>
于 2013-02-05T12:08:51.133 回答