当Table中td内容为空时,显示边框的办法
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" |
浏览器支持
所有主流浏览器都支持 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" |
浏览器支持
所有浏览器都支持 empty-cells 属性。
注释:如果已规定 !DOCTYPE,那么 Internet Explorer 8 (以及更高版本)支持 empty-cells 属性。
可能的值
| 值 | 描述 |
|---|---|
| hide | 不在空单元格周围绘制边框。 |
| show | 在空单元格周围绘制边框。默认。 |
| inherit | 规定应该从父元素继承 empty-cells 属性的值。 |
相关页面
当Table中td内容为空时,显示边框的办法的更多相关文章
- 当Table中td内容为空时,让它显示边框的办法
1 在 table的css里面加 border-collapse:collapse; 在 td 的css里面加 empty-cells:show; border-collapse设置或检索表 ...
- table中td内容过长 省略号显示
首先设置 css样式: table { table-layout: fixed;} HTML中的table代码: <tr> <th class="col-md-1" ...
- table中td 内容超长 自动折行 (含字母数字文字)
<table style="width:100%;table-layout:fixed;"> //列宽由表格宽度和列宽度设定 <thead> <th& ...
- table中td内容过长自动换行
table { table-layout:fixed; WORD-BREAK:break-all;}
- 如何让table中td宽度固定
table中td会随着里面的内容伸缩,设置其width样式并没有效果.这个时候需要下面的CSS可以实现. 首先是设置table .table {table-layout:fixed;} 其次是td . ...
- 怎样推断DIV中的内容为空
怎样推断DIV中的内容为空 1.问题背景 推断div内部是否为空.假设为空,给出无数据提示:否则显示正常页面 2.设计源代码 <!DOCTYPE html PUBLIC "-//W3C ...
- 如何让table中td与四周有间距
如何让table中td与四周有间距 方法一 在td下再添加一个会计元素 <tr> <td>第2节</td> <td>语文</td> < ...
- C# 去除Split()中去除内容为空的数据
C#去除Split()中去除内容为空的数据 var str="0001,0002,"; var strusers1 = str.Split(','); ///结果["0 ...
- vue 在有大数据量的 table 中使用弹窗 input 输入数据时卡顿解决方案
vue 在有大数据量的 table 中使用弹窗 input 输入数据时卡顿解决方案 原因:vue在进行输入时,进行了多次的render刷新渲染操作,导致了input框输入时发生的卡顿现象 解决方法:在 ...
随机推荐
- 微信js-sdk注意事项
1.录音结束后播放需要localId,用 var voice = { localId: '', serverId: '' }; 来存储,然后用voice.localId引用 2.token和ticke ...
- jQuery刮彩票兑奖效果
效果体验:http://keleyi.com/a/bjad/uaq24pxt.htm 其中拖拽刮涂层效果使用jquery UI的draggable方法,请参考:http://keleyi.com/a/ ...
- javascript中的弹框
大家都见过某度中的恶意广告,你关闭了又出来了!为何,JS来告诉你 效果猛戳此处 HTML <body> <h3 class="whiteColor">无法关 ...
- ArcSDE解除图层锁定
SDE数据库用来共享.交互数据,比较好用,但经常被B/S那边锁定图层 ,导致不能编辑图层. 查看锁定是谁锁定了用户的命令: sdemon -o info -I users -i esri_sde 解决 ...
- SuperMap iServer 扩展服务及扩展服务提供者范例
一.扩展服务实例 1.将iserver-extend1下的listener.java打成jar包2.复制到D:\SuperMap-iServer\webapps\iserver\WEB-INF\lib ...
- VS2012 单元测试之泛型类(Generics Unit Test)
关于单元测试,如果不会用可以参照我的上篇博文————在Visual Studio 2012使用单元测试 首先分享一篇博文,[Visual Studio] 开启Visual Studio 2012通过右 ...
- IOS开发基础知识--碎片33
1:AFNetworking状态栏网络请求效果 直接在AppDelegate里面didFinishLaunchingWithOptions进行设置 [[AFNetworkActivityIndicat ...
- Eclipse 常用快捷键 For MAC
Eclipse 常用快捷键 For MAC Option + Command + X: 运行Command + O:显示大纲Command + 1:快速修复Command + D:删除当前行Comma ...
- iOS 动画绘制线条颜色渐变的折线图
效果图 .................... 概述 现状 折线图的应用比较广泛,为了增强用户体验,很多应用中都嵌入了折线图.折线图可以更加直观的表示数据的变化.网络上有很多绘制折线图的demo,有 ...
- footer置底
html代码: <div class="container"> <div cass="header"></div> < ...