table标签修改tr,td标签的行距
修改tr标签的行距,tbale标签的td标签间距
- 看如下Css文件的代码,其都没有table的tr行距产生效果
tr{
margin-top: 10px;
padding: 10px;
}
td{
margin-left: 2px;
}
这个设置其实,会没有效果的,原因就是对于table来说,它有一个属性值会设置是否当成一个整体来看,且其有设置table元素间距行距的属性。
- border-collapse 属性设置表格的边框是否被合并为一个单一的边框
| 属性值 | 作用描述 |
|---|---|
| separate | 默认值。边框会被分开。不会忽略 border-spacing 和 empty-cells 属性。 |
| collapse | 如果设置的话,边框会合并为一个单一的边框。会忽略 border-spacing 和 empty-cells 属性。 |
| inherit | 从父元素继承 border-collapse 属性的值,大多数为collapse |
- border-collapse属性加上border-spacing属性就可以设置tr标签行间距,和td标签的间距
<table style="border-collapse:separate; border-spacing:0px 10px;">
<tr>
<td>不等风雨,只等你</td>
<td>汝,知否?</td>
</tr>
<tr>
<td>春风十里不如你</td>
<td>汝,知否?</td>
</tr>
<tr>
<td>漂洋过海来看你</td>
<td>汝,知否?</td>
</tr>
</table>
border-spacing:2px 5px;第一个参数代表td的间距,第二个参数代表tr的行距。
table标签修改tr,td标签的行距的更多相关文章
- jQuery获取table表中的td标签
首先我来介绍一下我遇到的问题 1.当有一个table表包含了<tr>标签,<td>标签,大致可以认为是这样的: <tr> <td> @scene.ID ...
- HTML 表格<table><caption><th><tr><td><thead><tbody><tfoot><col><colgroup>
<table>标签: 定义和用法: <table>标签定义HTML表格. 简单的HTML表格由table元素以及一个或多个tr.th或td元素组成. tr元素定义表格行,th元 ...
- jQuery遍历table中的tr td并获取td中的值
jQuery遍历table中的tr td并获取td中的值 $(function(){ $("#tableId tr").find("td").each(func ...
- JS从后台获取数据,前台动态添加tr标签中的td标签
功能描述: 要求从后台查询该省份的所有城市,然后动态的再前台固定的tr标签中添加相应的td标签来展示城市基本信息: 文章目录 #一.前台jsp及js源码 jsp:在固定的tr标签中添加一个id,通过j ...
- table样式测试总结tr td宽度分析
题外话:一直以来习惯布局用ul,li样式调整比较方便,不会互相影响出现一些问题,but~现在公司涉及很多表格打印,都是用table写的,好多宽度高度合并啊,组合啊~~~,单元格之间互相影响,有的样式设 ...
- 对<tr><td>标签里的input 循环取值
需求描述:单击table整行,跳转到具体的信息页面 关键就是获取整行的id,传给后台做查询,返回list 解决思路:用带参数函数传过去id,然后在js的函数中用$("#id"). ...
- zf-关于<ww:iterator /> 标签中的<td /> 标签添加序号问题
一开始代码是这样的 那个<ww:if> 标签 是我添加的,可是添加之后出问题了. 因为我加了一个判断语句,使得不需要的信息没显示出来,导致#li.count 这个显示下标的方法行不通了 之 ...
- HTML——表格table标签,tr或者td
表格定义和用法 <tr> 标签定义 HTML 表格中的行. tr 元素包含一个或多个 th 或 td 元素. HTML 与 XHTML 之间的差异 在 HTML 4.01 中,tr 元素的 ...
- 前端 HTML body标签相关内容 常用标签 表格标签 table
表格标签 table 表格由<table> 标签来定义.每个表格均有若干行(由 <tr> 标签定义),每行被分割为若干单元格(由<td>标签定义).字母 td 指表 ...
随机推荐
- 【转载】 tensorflow的单层静态与动态RNN比较
原文地址: https://www.jianshu.com/p/1b1ea45fab47 yanghedada -------------------------------------------- ...
- Spark2-数据探索
freqItems sampleBy cov crosstab approxQuantitle boolmFilter 布隆选择器 corr 皮尔逊相关系数 countMinSketch Spark2 ...
- SDN实验---Ryu的应用开发(一)Hub实现
补充: (一)Ubuntu下安装Notepadqq 背景:为什么安装Notepadqq Notepad++ 不仅有语法高亮度显示,也有语法折叠功能,并且支持宏以及扩充基本功能的外挂模组.但是可惜的是N ...
- [计算机视觉][神经网络与深度学习]R-FCN、SSD、YOLO2、faster-rcnn和labelImg实验笔记
R-FCN.SSD.YOLO2.faster-rcnn和labelImg实验笔记 转自:https://ask.julyedu.com/question/7490 R-FCN paper:https: ...
- 如何确定垃圾?JVM GC ?
如何确定垃圾? 正文 如何确定垃圾? 前面已经提到 JVM 可以采用 引用计数法 与 可达性分析算法 来确定需要回收的垃圾,我们来具体看一下这两种算法: 引用计数法 该方法实现为:给每个对象添加一个引 ...
- openstack keystone 命令详细
命令使用之前需要 运行命令行“. admin-openrc” 用户(User) 查看用户列表 openstack user list 创建用户 openstack user create [-h] ...
- [转帖]B树索引和位图索引的结构介绍
B树索引和位图索引的结构介绍 http://blog.itpub.net/12679300/viewspace-1174236/ 一 前言:? ROWID:包含键值的行的行ID,(查找块的最快方法, ...
- day42——外键的限制和解决方法、外键的三种约束模式、修改表(单表查询)
day42 外键的限制和解决方法 可以添加外键关联的那个字段可以是 被唯一(unique)约束的字段 或者 主键 限制:+ 由于外键的使用,致使多个表之间产生了联系,当我们对这些表进行更新或删除操作的 ...
- Selenium_css 元素定位
1.通过id定位 # 代表id driver.find_element_by_css_selector("#kw").send_keys("hao" ...
- [高清] JavaEE开发的颠覆者 Spring Boot实战 完整版
------ 郑重声明 --------- 资源来自网络,纯粹共享交流, 如果喜欢,请您务必支持正版!! --------------------------------------------- 下 ...