页面制作中最头痛的,表格的边框算是其一了。一不小心就会出现双重线

border-collapse属性 很好的解决了纠结了很久的问题

.table{border: 1px solid #ccc;border-collapse: collapse; width:80%;}.table th,.table td{border: 1px solid #ccc;padding: 10px;}

<table class="table">
  <thead>
    <tr>
      <th>id</th>
      <th>作者</th>
      <th>书名</th>
      <th>内容</th>
      <th>分类</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>001</td>
      <td>唐家三少</td>
      <td>斗破苍穹</td>
      <td>斗破苍穹斗破苍穹</td>
      <td>玄幻</td>
    </tr>
    <tr class="success">
      <td>001</td>
      <td>唐家三少</td>
      <td>斗破苍穹</td>
      <td>斗破苍穹斗破苍穹</td>
      <td>玄幻</td>
    </tr>
  </tbody>
</table>

运行后的样子:

表格中border-collapse属性的更多相关文章

  1. css中的border-collapse属性如何设置表格边框线?(代码示例)

    css中的border-collapse属性如何设置表格边框线?本篇文章就给大家介绍css中的border-collapse属性是什么? border-collapse属性设置表格边框线的方法.有一定 ...

  2. oracle数据库查询日期sql语句(范例)、向已经建好的表格中添加一列属性并向该列添加数值、删除某一列的数据(一整列)

    先列上我的数据库表格: c_date(Date格式)     date_type(String格式) 2011-01-01                   0 2012-03-07         ...

  3. 五十六、SAP中LVC表格的常用布局属性LVC_S_LAYO

    一.LVC_S_LAYO为表格常用的布局属性,包括网格线,宽度自适应,隐藏主键等 二.我们来对比使用前和使用后的表格,这个原始布局风格的表格 三.这个是设置了相关属性的表格

  4. 细说CSS中的display属性

    相信大部分奋战在前端的,尤其在前端攻城的过程中,有一种越陷越深的感觉,不错,一如前端深似海,从此妹子是浮云啊,前端上手容易,深入难啊!下面我就CSS中的display属性讲下我自己所积累的,与大家共享 ...

  5. js中style的属性

    下面这些属性都是通过js的style来设置css.只是整理了一部分,详细的可以参考相应的学习网站,不好的地方欢迎大家拍砖. alignContent :"" 属性在弹性容器内的各项 ...

  6. html表格中的tr td th用法

      表格是html中经常使用到的,简单的使用可能很多人都没问题,但是更深入的了解的人恐怕不多,下面我们先来看一下如何使用. <table>是<tr>的上层标签 <tr&g ...

  7. (转)用JS实现表格中隔行显示不同颜色

    用JS实现表格中隔行显示不同颜色 第一种: <style> tr{bgColor:expression(     this.bgColor=((this.rowIndex)%2==0 )? ...

  8. js如何实现动态的在表格中添加和删除行?(两种方法)

    js如何实现动态的在表格中添加和删除行?(两种方法) 一.总结 1.table元素有属性和一些方法(js使用) 方法一:添加可通过在table的innerHTML属性中添加tr和td来实现 tab.i ...

  9. js如何实现动态在表格中添加标题和去掉标题?

    js如何实现动态在表格中添加标题和去掉标题? 一.总结 1.通过table标签的createCaption(),deleteCaption()方法实现. document.getElementById ...

  10. table表格整体居中 和 table表格中各行各列内容居中

    1.table表格整个居中<div style="text-align: center;"> <table border="1" style= ...

随机推荐

  1. linux内核分析 第八周读书笔记

    第四章 进程调度 4.1 多任务 1.多任务操作系统就是能同时并发的交互执行多个进程的操作系统. 2.多任务操作系统使多个进程处于堵塞或者睡眠状态,实际不被投入执行,这些任务尽管位于内存,但是并不处于 ...

  2. 解题:POI 2008 Subdivision of Kingdom

    题面 还可以这么搜......学到了(PoPoQQQ orz) 我们最朴素的做法是枚举所有状态(当然可以剪,剪完最终实际状态量也是$C_{26}^{13}$的),然后每次$O(n)$扫一遍判断,大概会 ...

  3. OS X 安装pyspider

    pyspider安装的过程中,需要安装pycurl.有几个坑 一.首先遇到权限的问题 因为/Library目录是root权限,所以非root用户对该目录的读写经常会遇到权限问题,但是不宜切换成root ...

  4. YY淘宝商品数据库设计

    http://www.cnblogs.com/mmmjiang13/archive/2010/11/04/1868609.html 前言 这几个月都在做一个通过淘宝API线下管理淘宝店的系统,学习了很 ...

  5. 1044 Shopping in Mars

    Shopping in Mars is quite a different experience. The Mars people pay by chained diamonds. Each diam ...

  6. python3 安装MySQLdb及无法打开mysql.h问题解决(win7 )

    在Flask中要连接mysql数据库,需要安装flask-mysqldb. pip install flask-mysqldb 用pip安装MySQLdb 中遇到如下问题,折腾半天之久,多方尝试,终搞 ...

  7. day15 接口与异常

    接口 是一种独立于类的新机制,它关注的是行为. 接口的意义就体现在——让没有继承关系的类共享这些行为,各有各的具体实现. 设计上:当我们发现一个或多个类的方法相同,又没有继承关系,则考虑接口. 命名: ...

  8. 转:AutoLayout中的Content Hugging 和 Content Compression Resistance

    OS6中引入了AutoLayout,极大的方便了UI元素的布局,现在已经过去一年了,并且大部分设备的系统也已经升级到了iOS6,是时候要使用此项技术了. 在AutoLayout的学习中有两个概念官方文 ...

  9. Bayer图像处理

    Bayer是相机内部的原始图片, 一般后缀名为.raw. 很多软件都可以查看, 比如PS.我们相机拍照下来存储在存储卡上的.jpeg或其它格式的图片, 都是从.raw格式转化过来的..raw格式 内部 ...

  10. 安装解压版的mariadb

    今天尝试了安装解压版的mariadb,在官网上https://downloads.mariadb.org/下载了5.5版本的mariadb的zip压缩包, 经过实践发现mariadb解压版安装与mys ...