1. 在 table的css里面加: border-collapse:collapse;
在 td 的css里面加: empty-cells:show;

2 .最简单的就是 在TD里写个 

 

说明:

border-collapse设置或检索表格的行和单元格的边是合并在一起还是按照标准的HTML样式分开。

定义和用法

border-collapse 属性设置表格的边框是否被合并为一个单一的边框,还是象在标准的 HTML 中那样分开显示。

默认值: separate
继承性: yes
版本: CSS2
JavaScript 语法: object.style.borderCollapse="collapse"

实例

为表格设置合并边框模型:

table
{
border-collapse:collapse;
}

TIY

浏览器支持

所有主流浏览器都支持 border-collapse 属性。

注释:任何的版本的 Internet Explorer (包括 IE8)都不支持属性值 "inherit"。

注释:如果没有规定 !DOCTYPE,则 border-collapse 可能产生意想不到的结果。

可能的值

描述
separate 默认值。边框会被分开。不会忽略 border-spacing 和 empty-cells 属性。
collapse 如果可能,边框会合并为一个单一的边框。会忽略 border-spacing 和 empty-cells 属性。
inherit 规定应该从父元素继承 border-collapse 属性的值。

 

empty-cells:

定义和用法

empty-cells 属性设置是否显示表格中的空单元格(仅用于“分离边框”模式)。

注释:某些版本的 IE 浏览器不支持此属性。

说明

该属性定义了不包含任何内容的表单元格如何表示。如果显示,就会绘制出单元格的边框和背景。除非 border-collapse 设置为 separate,否则将忽略这个属性。

默认值: show
继承性: yes
版本: CSS2
JavaScript 语法: object.style.emptyCells="hide"

实例

隐藏表格中空单元格上的边框和背景:

table
{
border-collapse:separate;
empty-cells:hide;
}

亲自试一试

浏览器支持

所有浏览器都支持 empty-cells 属性。

注释:如果已规定 !DOCTYPE,那么 Internet Explorer 8 (以及更高版本)支持 empty-cells 属性。

可能的值

描述
hide 不在空单元格周围绘制边框。
show 在空单元格周围绘制边框。默认。
inherit 规定应该从父元素继承 empty-cells 属性的值。

相关页面

当Table中td内容为空时,显示边框的办法的更多相关文章

  1. 当Table中td内容为空时,让它显示边框的办法

    1 在 table的css里面加 border-collapse:collapse; 在 td 的css里面加      empty-cells:show; border-collapse设置或检索表 ...

  2. table中td内容过长 省略号显示

    首先设置 css样式: table { table-layout: fixed;} HTML中的table代码: <tr> <th class="col-md-1" ...

  3. table中td 内容超长 自动折行 (含字母数字文字)

    <table style="width:100%;table-layout:fixed;"> //列宽由表格宽度和列宽度设定 <thead> <th& ...

  4. table中td内容过长自动换行

    table { table-layout:fixed; WORD-BREAK:break-all;}

  5. 如何让table中td宽度固定

    table中td会随着里面的内容伸缩,设置其width样式并没有效果.这个时候需要下面的CSS可以实现. 首先是设置table .table {table-layout:fixed;} 其次是td . ...

  6. 怎样推断DIV中的内容为空

    怎样推断DIV中的内容为空 1.问题背景 推断div内部是否为空.假设为空,给出无数据提示:否则显示正常页面 2.设计源代码 <!DOCTYPE html PUBLIC "-//W3C ...

  7. 如何让table中td与四周有间距

    如何让table中td与四周有间距 方法一 在td下再添加一个会计元素 <tr> <td>第2节</td> <td>语文</td> < ...

  8. C# 去除Split()中去除内容为空的数据

    C#去除Split()中去除内容为空的数据 var  str="0001,0002,"; var strusers1 = str.Split(','); ///结果["0 ...

  9. vue 在有大数据量的 table 中使用弹窗 input 输入数据时卡顿解决方案

    vue 在有大数据量的 table 中使用弹窗 input 输入数据时卡顿解决方案 原因:vue在进行输入时,进行了多次的render刷新渲染操作,导致了input框输入时发生的卡顿现象 解决方法:在 ...

随机推荐

  1. C# Cache 设定缓存过期时间方法 绝对过期时间 和 相对过期时间(即:访问激活后不过期)

    摘自: http://www.cnblogs.com/zj1111184556/p/3493840.html 1. 设定绝对过期时间 /// <summary> /// 设定绝对的过期时间 ...

  2. C#登入例子--第一个程序

    第一步:在数据库创建一个存放账号密码的表单 第二步:创建一个登入项目 拆分成三层: CS层: BLL层: DAL层: Common层: Web.config:

  3. html meta标签使用总结

    meta标签作用 META标签是HTML标记HEAD区的一个关键标签,提供文档字符集.使用语言.作者等基本信息,以及对关键词和网页等级的设定等,最大的作用是能够做搜索引擎优化(SEO). PS:便于搜 ...

  4. $(function) ready onload 等区别

    新手接触javascript.jquery的时候不可避免的要接触题目所标识的相关内容,反复看过几次一到用的时候总是不踏实,写文以记之. 符号“$”是jquery对象(个人这样理解,拥有函数的用法).接 ...

  5. 理解CSV文件以及ABAP中的相关操作

    在很多ABAP开发中,我们使用CSV文件,有时候,关于CSV文件本身的一些问题使人迷惑.它仅仅是一种被逗号分割的文本文档吗? 让我们先来看看接下来可能要处理的几个相关组件的词汇的语义. Separat ...

  6. iOS 开发技术牛人博客

    dark_gmn 的博客   http://blog.csdn.net/dark_gmn?viewmode=contents Tel_小超 的博客  http://blog.csdn.net/qq_2 ...

  7. JavaScript - 基于CSS3动画的实现

    在痛苦的IE8时代,所有的动画都只能基于自己计算相关动画属性,开定时器setTimeout/setInterval轮询动画任务. 而肩负重任的HTML5,早已注意到了日益增强的动画,随着HTML5的降 ...

  8. [ jquery 过滤器 hasClass(class) ] 此方法用于在选择器的基础之上检查当前的元素是否含有某个特定的类,如果有,则返回true

    此方法用于在选择器的基础之上检查当前的元素是否含有某个特定的类,如果有,则返回true 实例: <!DOCTYPE html> <html lang='zh-cn'> < ...

  9. MyEclipse 2016 CI 4新增BootStrap模板

    Live Preview with CodeLive 目前CodeLive还只有Live Preview这一个功能,在后续的版本中会陆续添加新功能. 新增Bootstrap模板 在模板面板中选择相应的 ...

  10. ButterKnife基本使用

    ButterKnife基本使用 Butter Knife处理字段和方法绑定.   重要更新: 目前(2016.4.29), ButterKnife的最新版本是8.0.1. Demo项目已更新: htt ...