zoukankan      html  css  js  c++  java
  • CSS:用DIV+CSS实现表格形式的数据排列

    <!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>www.webjx.com</title>
    <style type="text/css">
    * {
    margin:0;
    padding:0;
    font-size:12px;
    color:#000;
    }

    #biaoge {
    405px;
    margin:50px auto;
    }

    #biaoge li,#biaoge li.biaotou {
    list-style-type:none;
    100px;
    height:30px;
    line-height:30px;
    text-align:center;
    float:left;
    margin-left:1px;
    margin-bottom:1px;
    background:#ccc;
    }

    #biaoge li.biaotou {
    background:#999;
    }
    </style>
    </head>
    <body>

    <ul id="biaoge">
    <li class="biaotou">第一列</li>
    <li class="biaotou">第二列</li>
    <li class="biaotou">第三列</li>
    <li class="biaotou">第四列</li>

    <li>数据1-1</li>
    <li>
    数据1-2</li>
    <li>数据1-3</li>
    <li>数据1-4</li>
    <li>数据2-1</li>
    <li>数据2-2</li>
    <li>数据2-3</li>
    <li>数据2-4</li>
    <li>数据3-1</li>
    <li>数据3-2</li>
    <li>数据3-3</li>
    <li>数据3-4</li>
    <li>数据4-1</li>
    <li>数据4-2</li>
    <li>数据4-3</li>
    <li>数据4-4</li>
    </ul>
    </body>

    </html>
  • 相关阅读:
    CentOS 7 虚拟机的安装
    2 MySQL rpm
    01-在实体类上加了lombok的@Data注解
    02-myBatisPlus的wrapper接口的使用
    2 MySQL rpm 安装 --下载
    1-MySQL介绍
    MySQL的不归路
    电脑型号4 1500 内存大 机械大硬盘
    电脑型号3 1200 大硬盘
    电脑概览 2 1200 固态SSD
  • 原文地址:https://www.cnblogs.com/JamyWong/p/1813889.html
Copyright © 2011-2022 走看看