制作细线表格，我想应该是最基本的css知识了，记录下来巩固下。

推荐：

table{

    border-collapse:collapse;

    border: 1px solid #000000;

}  

td{

    border-collapse:collapse;

    border: 1px solid #000000;

}

示例：

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <title>Css制作table细线表格</title>

    <style type="text/css">

       .table {

            border: 1px solid #ddd;

            border-collapse: collapse;

        }

        .table thead tr th,

        .table tbody tr td {

            padding: 8px 12px;

            text-align: center;

            color: #333;

            border: 1px solid #ddd;

            border-collapse: collapse;

            background-color: #fff;

        }

    </style>

</head>

<body>

    <table class="table" cellspacing="0" cellpadding="0">

    <thead>

        <th>编号</th>

        <th>姓名</th>

        <th>性别</th>

        <th>电话号码</th>

        <th>生日</th>

    </thead>

    <tbody>

        <tr><td>1</td><td>coco</td><td>男</td><td>12345678888</td><td>2018-04-11 00:00:00</td></tr>

        <tr><td>2</td><td>cici</td><td>男</td><td>13688889999</td><td>2018-04-11 00:00:00</td></tr>

        <tr><td>3</td><td>tom</td><td>男</td><td>13656565656</td><td>2018-04-11 00:00:00</td></tr>

    </tbody>

</table>

</body>

</html>

效果图：

Css制作table细线表格的更多相关文章

  1. 利用CSS生成精美细线Table表格

    精美的表格是前端开发用到的一个组件,很多时候我们利用复杂的页面style代码,来生成这样的表格,造成了页面的修改性和可读性都非常差.这里推荐直接使用css来产生一个细线表格. 使用方法也很简单: 第一 ...

  2. html制作细线表格

    关于这个细线表格的制作方法,百度一下可能就会有答案告诉你设置这几个值:给table设置border="0" cellspacing="1" bgcolor=&q ...

  3. 基于CSS属性display:table的表格布局的使用

    项目改造中遇到DIV+CSS实现的table,新需求需要在表格使用单元格合并,网上调查返现CSS display:table实现的table表格,没有单元格的属性和样式,经过一番思考,曲折现实了单元格 ...

  4. CSS Table（表格）

    CSS Table(表格) 一.表格边框 border 指定CSS表格边框,使用border属性. 下面的例子指定了一个表格的Th和TD元素的黑色边框: table, th, td { border: ...

  5. 初探css -11 Table表格

    CSS 表格 使用 CSS 可以使 HTML 表格更美观. Company Contact Country Alfreds Futterkiste Maria Anders Germany Bergl ...

  6. [转]DIV+CSS和TABLE的区别

    现在全国大大小小的网站都在搞一场技术“革命”,就是所谓“网站重构”说简单点就是DIV+CSS进行网站制作.用DIV+CSS代替传统的Table制作框架和美化页面.百度搜索优化 在重构之前,肯定要了解为 ...

  7. CSS制作图片水平垂直居中

    所谓的图片水平垂直居中就是把图片放在一个容器元素中(容器大于图片尺寸或是指定了大小的容器),并且图片位居此容器正中间(中间是指元素容器的正中间),而图片不是以背景图片(background-image ...

  8. CSS制作水平垂直居中对齐

    作为前端攻城师,在制作Web页面时都有碰到CSS制作水平垂直居中,我想大家都有研究过或者写过,特别的其中的垂直居中,更是让人烦恼.这段时间,我收集了几种不同的方式制作垂直居中方法,但每种方法各有千秋呀 ...

  9. Html细线表格的实现 打印边框设置

    在网页制作中,我们常常会使用到表格,表格使得需要表达的信息更清楚,明了. <table border="1" cellspacing="0" border ...

随机推荐

  1. HTML5Audio/Video全解（疑难杂症）

    1.mp4格式视频无法在chrome中播放 Chrome浏览器支持HTML5,它支持原生播放部分的MP4格式(不用通过Flash等插件).为 什么是部分MP4呢?MP4有非常复杂的含义(见http:/ ...

  2. jvm 指令重排

    引言:在Java中看似顺序的代码在JVM中,可能会出现编译器或者CPU对这些操作指令进行了重新排序:在特定情况下,指令重排将会给我们的程序带来不确定的结果..... 1.  什么是指令重排? 在计算机 ...

  3. SringCloud学习成长之路 八 消息总线

    Spring Cloud Bus 将分布式的节点用轻量的消息代理连接起来.它可以用于广播配置文件的更改或者服务之间的通讯,也可以用于监控.本文要讲述的是用Spring Cloud Bus实现通知微服务 ...

  4. PAT 甲级 1055 The World's Richest (25 分)（简单题，要用printf和scanf，否则超时，string 的输入输出要注意）

    1055 The World's Richest (25 分)   Forbes magazine publishes every year its list of billionaires base ...

  5. html5调整音频音高

    var audioSrc = 'https://s3-us-west-2.amazonaws.com/s.cdpn.io/1715/the_xx_-_intro.mp3'; function buff ...

  6. Permission denied: user=dr.who, access=READ_EXECUTE, inode="/tmp":student:supergroup:drwx------权限问题

    在查看browse directory时,点击tmp,无法进入,报错:“Permission denied: user=dr.who, access=READ_EXECUTE, inode=" ...

  7. spark在windows的配置

    在spark-env.cmd添加一行 FOR /F %%i IN ('hadoop classpath') DO @set SPARK_DIST_CLASSPATH=%%i 修改:log4j.prop ...

  8. 初步了解Docker容器(三)

    目录 一.初步了解 1.docker run运行容器 2.docker images查看镜像 3.docker ps查看容器 4.查看其Dockerfile文件 二.Docker 知识问答 小结 一. ...

  9. 【计算机视觉】Object Proposal之BING理解

    发现: 本论文主要有两大亮点.第一个亮点是发现了在固定窗口的大小下,物体与背景的梯度模式有所不同.如图1所示.图1(a)中绿框代表背景,红框代表物体.如果把这些框都resize成固定大小,比如8X8, ...

  10. go基础系列 第二章 go指针

    一. 指针 先来看一段代码 var pa *int pa = &a *pa = fmt.Println(a) 这里定义了一个int类型的变量a, 有定义了一个指针类型的变量pa, 让pa指向了 ...