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

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. 轻量高效的开源JavaScript插件和库 【转】

    图片 布局 轮播图 弹出层 音频视频 编辑器 字符串 表单 存储 动画 时间 其它 加载器 构建工具 测试 包管理器 CDN 图片 baguetteBox.js - 是一个简单易用的响应式图像灯箱效果 ...

  2. 解题:BZOJ 4644 经典砂比题(雾

    题面 初见线段树分治 (对我来说可不是什么经典题=.=) 把时间轴建出来一棵线段树,然后在对应的区间上打标记,最后把整棵树DFS一遍,到叶节点输出答案即可 (把最终答案开成全局的了调了半天 #incl ...

  3. C++ STL之LIST详解A

    List 容器 list是C++标准模版库(STL,Standard Template Library)中的部分内容.实际上,list容器就是一个双向链表,可以高效地进行插入删除元素. 使用list容 ...

  4. 5.Qt模块简介

    Qt 5 与 Qt 4 最大的一个区别之一是底层架构有了修改.Qt 5 引入了模块化的概念,将众多功能细分到几个模块之中.Qt 4 也有模块的概念,但是是一种很粗的划分,而 Qt 5 则更加细化.本节 ...

  5. 题解【51nod 1290 Counting Diff Pairs】

    Description 求区间内有多少对 \((i,j)\) 满足 \(|a_i - a_j| \leq k\) Solution 可以莫队做(万能的莫队) 只需要考虑加入一个数会产生多少贡献即可 离 ...

  6. day10 浅谈面向对象编程

    面向对象编程:第一步找名词,名词是问题域中的. 第二步概括名词设计成类.某些名词可以浓缩包含到其它名词中,成为其属性. 第三步找动词,动词也是问题域中的.   第四步概括动词设计成方法.动作的产生往往 ...

  7. 浅谈splay(点的操作)

    浅谈splay(点的操作) 一.基本概念 splay本质:二叉查找树 特点:结点x的左子树权值都小于x的权值,右子树权值都大于x的权值 维护信息: 整棵树:root 当前根节点  sz书上所有结点编号 ...

  8. Intellij IDEA设置及快捷键使用总结

    1. IDEA内存优化 先看看你机器本身的配置而配置. \IntelliJ IDEA 8\bin\idea.exe.vmoptions -------------------------------- ...

  9. git 第一次关联远程仓库

    1.首先需要先git pull origin master 2.然后合并两个无关的仓库 git pull origin master --allow-unrelated-histories

  10. [大数据测试]ETL测试或数据仓库测试入门

    转载自: http://blog.csdn.net/zhusongziye/article/details/78633934 概述 在我们学习ETL测试之前,先了解下business intellig ...