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>
  • 相关阅读:
    bzoj3688 折线统计
    bzoj3678 wangxz与OJ
    「6月雅礼集训 2017 Day8」route
    「6月雅礼集训 2017 Day8」gcd
    [ SHELL编程 ] 编程常用的ORACLE相关命令
    Oracle数据库备份/导入工具
    Oracle数据文件迁移到裸设备
    Oracle数据文件转移操作
    Oracle重建表空间操作实例
    Linux性能测试分析命令_sar
  • 原文地址:https://www.cnblogs.com/xkzy/p/3927661.html
Copyright © 2011-2022 走看看