设置table表格的单元格间距两种方式
table表格里设置单元格td之间的间距,通常用cellspacing设置单元格间距,有时候该属性可能无效,或需要用其他方式时,可用其他方式实现,例如在背景是白色背景的时候,设置单元格td的border,边框设置一定数值,边框为白色,这样白色的边框分隔了table的单元格,效果就类似设置了单元格间距。
例如该文,border-collapse:collapse和border:10px solid white,设置单元格间距是10px。
测试代码:
<style>
table td{width:50px;height:50px;background:blue;}
#d2 table{border-collapse:collapse;}
#d2 table td{border:10px solid white;}
</style>
<div id="d1">
<table cellspacing=10>
<tr>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td>3</td>
<td>4</td>
</tr>
</table>
</div> <div id="d2">
<table>
<tr>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td>3</td>
<td>4</td>
</tr>
</table>
</div>
图示:

设置table表格的单元格间距两种方式的更多相关文章
- Swift - 设置网格UICollectionView的单元格间距
要设置单元格cell的间距(水平间距,垂直间距)可进行如下设置: 方法1:在storyboard中设置 选择Collection View后在面板里设置Min Spacing相关属性(这里也可以设置单 ...
- JS获取table表格任意单元格值
jsp页面表格布局 <body onload="show()"> <center> <input type="text" valu ...
- display:table表格合并单元格
直接上代码: <%@ page language="java" contentType="text/html; charset=UTF-8" pageEn ...
- 设置Linux之CentOS7的网络的两种方式动态IP+静态IP
1 动态IP 参考之前的文章 点击进入 2 静态IP vi /etc/sysconfig/network-scripts/ifcfg-ens33 详情配置如下,上面半部分是我之前的动态IP的设置 静态 ...
- itextpdf中表格中单元格的文字水平垂直居中的设置
在使用itextpdf中,版本是5.5.6,使用Doucument方式生成pdf时,设置单元格中字体的对齐方式时,发现一些问题,并逐渐找到了解决方式. 给我的经验就是:看官网的例子才能保证代码的效果, ...
- javascript生成表格增删改查 JavaScript动态改变表格单元格内容 动态生成表格 JS获取表格任意单元格 javascript如何动态删除表格某一行
jsp页面表格布局Html代码 <body onload="show()"> <center> <input type="text" ...
- jquery操作表格 合并单元格
jquery操作table,合并单元格,合并相同的行 合并的方法 $("#tableid").mergeCell({ cols:[X,X] ///参数为要合并的列}) /** * ...
- 使用POI创建word表格合并单元格兼容wps
poi创建word表格合并单元格代码如下: /** * @Description: 跨列合并 */ public void mergeCellsHorizontal(XWPFTable table, ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表格:为所有表格的单元格添加边框
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
随机推荐
- Java并发(八)计算线程池最佳线程数
目录 一.理论分析 二.实际应用 为了加快程序处理速度,我们会将问题分解成若干个并发执行的任务.并且创建线程池,将任务委派给线程池中的线程,以便使它们可以并发地执行.在高并发的情况下采用线程池,可以有 ...
- deque_queue_list
#include <iostream> #include <deque>//front push pop back push pop [] at() #include < ...
- 代码的结合性:继承 扩展 组合 变换--swift暗含的四根主线
类型继承: 类型扩展: 类型组合: 类型变换:
- Jupyter的快捷键使用
命令模式 (按键 Esc 开启) Enter : 转入编辑模式 Shift-Enter : 运行本单元,选中下个单元 Ctrl-Enter : 运行本单元 Alt-Enter : 运行本单元,在其下插 ...
- 【LG2839】[国家集训队]middle
[LG2839][国家集训队]middle 题面 洛谷 题解 按照求中位数的套路,我们二分答案\(mid\),将大于等于\(mid\)的数设为\(1\),否则为\(-1\). 若一个区间和大于等于\( ...
- FDQuery Out of memory
4万行记录 FDQuery查询 Out of memory sql server 可以查询成功 First chance exception at $7505D722. Exception class ...
- 去掉idea的mybatis烦人的xml提示
可以在setting中自己找,也可以在顶部输入 No data sources configure , SQL dialect detection , Injected language fra ...
- 使用helm进行kubernetes包管理
1. 安装helm package https://github.com/helm/helm/blob/master/LICENSE 2. 将 helm 配置到环境变量 3. 使用helm的前提是安装 ...
- WDM驱动改可手动加卸载的NT驱动
WDM驱动改可手动加卸载的NT驱动 测试工具:osrloader 把一个WDM类型的驱动改成可动态加载/卸载,需要做以下2个修改: 1. 把SOURCES文件夹中的DRIVERTYPE=WDM去掉 2 ...
- dateTime格式转换
select Convert(varchar(8),GETDATE(),112) Select replace(CONVERT(varchar(8), GETDATE(), 108),':','')