Heim  >  Artikel  >  Web-Frontend  >  代码如下,在IE7下可以实现冻结效果,但是在IE8下则不可以,请问各位如何处理_html/css_WEB-ITnose

代码如下,在IE7下可以实现冻结效果,但是在IE8下则不可以,请问各位如何处理_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 12:26:151071Durchsuche

<!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> new document </title>    <style type="text/css">        .FixedHeaderColumnsTableDiv        {            overflow: auto;            position: relative;            border: 1px solid;        }        .FixedCell        {            position: relative;            top: expression(this.offsetParent.scrollTop);            left: expression(this.parentElement.offsetParent.scrollLeft);            background-color: buttonface;            border: 1px solid black;            z-index: 1800;        }                .FixedHeaderRow1        {            position: relative;            top: expression(this.offsetParent.scrollTop);            background-color: buttonface;            border: 0px solid black;            z-index: 300;        }        .FixedHeaderRow2        {            position: relative;            top: expression(this.offsetParent.scrollTop);            background-color: buttonface;            border: 0px solid black;            z-index: 290;        }        .FixedDataColumn        {            position: relative;             left: expression(this.parentElement.offsetParent.parentElement.scrollLeft);            background-color: buttonface;            border: 1px solid black;            z-index: 200;        }        table        {            border: 0px solid black;            z-index: 1;        }        td        {            position: relative;            border-right: 1px solid black;            border-bottom: 1px solid black;            z-index: 1;        }    </style></head><body>    <div class="FixedHeaderColumnsTableDiv" style="width: 1000px;height: 600px">        <table border="1" cellpadding="2" cellspacing="0" width="1200px">            <tr class="FixedHeaderRow1">                <td class="FixedCell" style="width: 80px" rowspan="2">                    header1                </td>                <td class="FixedCell" style="width: 80px">                    header2                </td>                <td class="FixedCell" style="width: 80px">                    header3                </td>                <td class="FixedCell" style="width: 80px">                    header4                </td>                <td style="width: 80px">                    header5                </td>                <td style="width: 80px">                    header6                </td>                <td style="width: 80px">                    header7                </td>                <td style="width: 80px">                    header8                </td>                <td style="width: 80px">                    header9                </td>                <td style="width: 80px">                    header10                </td>                <td style="width: 80px">                    header11                </td>                <td style="width: 80px">                    header12                </td>                <td style="width: 80px" rowspan="2">                    header13                </td>                <td style="width: 80px" rowspan="2">                    header14                </td>                <td style="width: 80px" rowspan="2">                    header15                </td>            </tr>            <tr class="FixedHeaderRow2">                <td class="FixedCell" style="width: 80px" align="center">                    <table>                        <tr>                            <td>                                <input type="button" id="" value="aa" />                            </td>                            <td>                                <input type="button" id="" value="aa" />                            </td>                        </tr>                    </table>                </td>                <td class="FixedCell" style="width: 80px" align="center">                    <input type="button" id="" value="aa" />                </td>                <td class="FixedCell" style="width: 80px">                    header16                </td>                <td class="FixedHeaderColumn1" style="width: 80px" colspan="8">                    header17                </td>            </tr>            <tr>                <td rowspan="2" class="FixedDataColumn">                    col1                </td>                <td rowspan="2" class="FixedDataColumn">                    col2                </td>                <td rowspan="2" class="FixedDataColumn">                    col3                </td>                <td class="FixedDataColumn">                    col4                </td>                <td>                    col5                </td>                <td>                    col6                </td>                <td>                    col7                </td>                <td>                    col8                </td>                <td>                    col9                </td>                <td>                    col10                </td>                <td>                    col11                </td>                <td>                    col12                </td>                <td rowspan="2">                    col13                </td>                <td rowspan="2">                    col14                </td>                <td rowspan="2">                    col15                </td>            </tr>            <tr>                <td class="FixedDataColumn">                    col16                </td>                <td style="word-wrap: word-break" colspan="8">                    <div style="overflow: auto;width: 1100px;height: 50px;border: 1px solid">                        col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达                    </div>                </td>            </tr>            <tr>                <td rowspan="2" class="FixedDataColumn">                    col1                </td>                <td rowspan="2" class="FixedDataColumn">                    col2                </td>                <td rowspan="2" class="FixedDataColumn">                    col3                </td>                <td class="FixedDataColumn">                    col4                </td>                <td>                    col5                </td>                <td>                    col6                </td>                <td>                    col7                </td>                <td>                    col8                </td>                <td>                    col9                </td>                <td>                    col10                </td>                <td>                    col11                </td>                <td>                    col12                </td>                <td rowspan="2">                    col13                </td>                <td rowspan="2">                    col14                </td>                <td rowspan="2">                    col15                </td>            </tr>            <tr>                <td class="FixedDataColumn">                    col16                </td>                <td style="word-wrap: word-break" colspan="8">                    <div style="overflow: auto;width: 1100px;height: 50px;border: 1px solid">                        col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达col17爱仕达                    </div>                </td>            </tr>            <tr>                <td rowspan="2" class="FixedDataColumn">                    col1                </td>                <td rowspan="2" class="FixedDataColumn">                    col2                </td>                <td rowspan="2" class="FixedDataColumn">                    col3                </td>                <td class="FixedDataColumn">                    col4                </td>                <td>                    col5                </td>                <td>                    col6                </td>                <td>                    col7                </td>                <td>                    col8                </td>                <td>                    col9                </td>                <td>                    col10                </td>                <td>                    col11                </td>                <td>                    col12                </td>                <td rowspan="2">                    col13                </td>                <td rowspan="2">                    col14                </td>                <td rowspan="2">                    col15                </td>            </tr>                          </table>    </div></body></html>


回复讨论(解决方案)

expression IE8以上和其他浏览器不支持

expression IE8以上和其他浏览器不支持
请问有什么方法可以解决呢?谢谢了!

<!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> new document </title>    <style>        *{            padding: 0;            margin: 0;        }        table{            border-spacing: 0;            border-collapse:collapse;        }        td{            border:1px solid        }    </style></head><body>    <div style="width:500px;height:500px;position: relative">        <table style="position: absolute;left: 0;right: 0;background: #ffffff">            <tr><td>111111111111</td><td>111111111111</td></tr>            <tr><td>111111111111</td><td>111111111111</td></tr>            <tr><td>111111111111</td><td>111111111111</td></tr>            <tr><td>111111111111</td><td>111111111111</td></tr>            <tr><td>111111111111</td><td>111111111111</td></tr>            <tr><td>111111111111</td><td>111111111111</td></tr>            <tr><td>111111111111</td><td>111111111111</td></tr>        </table>        <div style="width: 100%;height: 100%;overflow: auto;background: #ffffff">            <table>                <tr><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td></tr>                <tr><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td></tr>                <tr><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td></tr>                <tr><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td></tr>                <tr><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td></tr>                <tr><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td></tr>                <tr><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td><td>111111111111</td></tr>            </table>        </div>    </div></body></html>

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn