zoukankan      html  css  js  c++  java
  • CSS控制表格嵌套

    1. [图片] table.jpg    


    ​2. [代码]用CSS处理表格嵌套完整代码     

    <style type="text/css">
    .form-table{
        border-collapse:collapse;
        border-spacing:0px;
        border-style:solid solid solid solid;
        border-1px;
        border-color:#000000;
    }
    .form-table table{
        border-collapse:collapse;
        border-spacing:0px;
    }
    .form-table td{
        margin:0px;
        padding:0px;
        height:25px;
        line-height:25px;
        text-align:center;
        border-style:solid none none solid;
        border-1px;
        border-color:#000000;
    }
    .form-table table tr:first-child td{
        border-top-style:none;
    }
    .form-table table tr td:first-child{
        border-left-style:none;
    }
    </style>
    3. [代码]IE6不支持CSS的伪类,要用jQuery来处理     

    <!--IE6不支持CSS的伪类,要用jQuery来处理一下-->
    <!--[if IE 6]>
    <script language="javascript" src="jquery.js"></script>
    <script language="javascript">
    $(document).ready(function(){
        $(".form-table table tr:first-child td").css("border-top-style","none");
        $(".form-table table tr td:first-child").css("border-left-style","none");
    });http://www.enterdesk.com/special/shouhui/​
    </script>手绘图片
    <![endif]-->
    4. [代码]表格引用CSS的方法非常简单     
    <table width="50%" class="form-table" >
        <tr>
            <td>
                <table width="100%" >
                    <tr>
                        <td>&nbsp;</td>
                        <td>&nbsp;</td>
                    </tr>
                    <tr>
                        <td>&nbsp;</td>
                        <td>&nbsp;</td>
                    </tr>
                </table>
            </td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td>&nbsp;</td>
            <td>
                <table width="100%" >
                    <tr>
                        <td>&nbsp;</td>
                        <td>&nbsp;</td>
                        <td>&nbsp;</td>
                    </tr>
                    <tr>
                        <td>&nbsp;</td>
                        <td>
                            <table width="100%" >
                                <tr>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                </tr>
                            </table>
                        </td>
                        <td>&nbsp;</td>
                    </tr>
                    <tr>
                        <td>&nbsp;</td>
                        <td>&nbsp;</td>
                        <td>&nbsp;</td>
                    </tr>
                </table>
            </td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>
                <table width="100%" >
                    <tr>
                        <td>&nbsp;</td>
                        <td>&nbsp;</td>
                    </tr>
                    <tr>
                        <td>&nbsp;</td>
                        <td>&nbsp;</td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
  • 相关阅读:
    [IndiaHacks 2016
    [Northern Eurasia Finals Online 2020]D. Down We Dig(记忆化搜索,博弈)
    2018 ICPC Asia Nakhon Pathom Regional Contest-F.Lucky Pascal Triangle(杨辉三角,递归,分治,规律)
    The 2020 ICPC Asia Taipei-Hsinchu Site Programming Contest-C题 Pyramid (思维,递推,规律)
    [2020-2021 ACM-ICPC Brazil Subregional Programming Contest] K. Between Us (高斯消元解异或方程组)
    HDU-6252
    [AtCoder Regular Contest 109]-C
    [2016-2017 ACM-ICPC CHINA-Final]Problem C. Mr. Panda and Strips(DP+线段树)
    失败经1
    [2016-2017 ACM-ICPC CHINA-Final]-Problem H. Great Cells(贡献,组合数学)
  • 原文地址:https://www.cnblogs.com/xkzy/p/3927661.html
Copyright © 2011-2022 走看看