用UL实现非Table四行三列布局

  • 来源: 互联网 作者: 若水   2008-03-22/13:02
  • <!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>
    <meta http-equiv="Content-Type" content="text/HTML; charset=gb2312" />
    <title>用UL实现非Table四行三列布局</title>
    <style type="text/CSS">
    ul{
    margin:0px;
    padding:0px;
    width:200px;
    }
    ul li{
    float:left;
    list-style-type:none;
    border-top:#000 solid 1px;
                    border-left:#000 solid 1px;
    width:65px;
    }
    .border-r{
                   border-right:#000 solid 1px;
                    }
    .border-b{
                   border-bottom:#000 solid 1px;
                    }
    .border-l{
                   border-right:#000 solid 1px;
                   border-bottom:#000 solid 1px;
                    }
    </style>

    </head>

    <body>
    <ul>
    <li>&nbsp;</li>
    <li>&nbsp;</li>
    <li class="border-r">&nbsp;</li>
    </ul>
    <ul>
    <li>&nbsp;</li>
    <li>&nbsp;</li>
    <li class="border-r">&nbsp;</li>
    </ul>
    <ul>
    <li>&nbsp;</li>
    <li>&nbsp;</li>
    <li class="border-r">&nbsp;</li>
    </ul>
    <ul>
    <li class="border-b">&nbsp;</li>
    <li class="border-b">&nbsp;</li>
    <li class="border-l">&nbsp;</li>
    </ul>
    </body>
    </HTML>


    评论 {{userinfo.comments}}

    {{money}}

    {{question.question}}

    A {{question.A}}
    B {{question.B}}
    C {{question.C}}
    D {{question.D}}
    提交

    驱动号 更多