对于很多初学HTML的人来说,表格<table>是最常用的标签了,但对于表格边框的控制,很多初学者却不甚其解。

一般我们用表格的时候总会给它个border属性,比如:<table border="1">,其效果如下:

ID NAME GENDER
1001 mike male

可以发现表格的边框好像很宽,当然这里的“很宽”绝对不是表格border的宽,大家看到的宽应该是<td>之间有间隙所致。因此只需要修改表格的cellspacing属性即可,即:<table border="1px" cellspacing="0px">,效果如下:

ID NAME GENDER
1001 mike male

但是,好像宽度还是没有我们想象的那样:只有一个像素的宽,其实,上图大家看到的其实是两个像素的宽,为什么呢,这是因为<td>之间的边框没有重合所致。修改表格的border-collapse属性即可,

即<table border="1px" cellspacing="0px" style="border-collapse:collapse">

ID NAME GENDER
1001 mike male

再给表格加个颜色,<table border="1px" bordercolor="#000000" cellspacing="0px" style="border-collapse:collapse">

ID NAME GENDER
1001 mike male

html 表格边框的设置的更多相关文章

  1. HTML表格边框的设置小技巧

    对于很多初学HTML的人来说,表格<table>是最常用的标签了,但对于表格边框的控制,很多初学者却不甚其解. 对于很多初学HTML的人来说,表格<table>是最常用的标签了 ...

  2. (转)HTML表格边框的设置小技巧

    对于很多初学HTML的人来说,表格<table>是最常用的标签了,但对于表格边框的控制,很多初学者却不甚其解. 对于很多初学HTML的人来说,表格<table>是最常用的标签了 ...

  3. HTML表格边框的设置小技巧-表格

    对于很多初学HTML的人来说,表格<table>是最常用的标签了,但对于表格边框的控制,很多初学者却不甚其解. 一般我们用表格的时候总会给它个border属性,比如:<table b ...

  4. [转]CSS如何设置html table表格边框样式

    原文地址:http://www.divcss5.com/wenji/w503.shtml 对table设置css样式边框,分为几种情况: 1.只对table设置边框 2.对td设置边框 3.对tabl ...

  5. Android表格布局之设置边框

    Android表格布局本身没有边框,不过可以通过背景色的设置可以实现表格边框的显示. 首先可以设置TableRow的背景色,然后设置内容的背景色.根据它们的颜色差就出现了边框.只要微调Content与 ...

  6. css中的border-collapse属性如何设置表格边框线?(代码示例)

    css中的border-collapse属性如何设置表格边框线?本篇文章就给大家介绍css中的border-collapse属性是什么? border-collapse属性设置表格边框线的方法.有一定 ...

  7. CSS之表格边框合并、兄弟标签外边距合并、父子标签的外边距合并

    本文内容: 表格边框合并 兄弟标签外边距合并 父子标签的外边距合并 首发日期:2018-05-01 表格边框合并: 发生情况: 当设置了cellpadding="0" cellsp ...

  8. html的表格边框为什么会这么粗?

    因为默认情况下,cellspacing = 2px. 当表格的 border 不为 0 的时候,单元格(cell)的 border 为 1. 只有当表格的 border 设置为 0 的时候,单元格的 ...

  9. JavaScript变换表格边框颜色

    效果查看:http://hovertree.com/texiao/js/2.htm 代码如下,保存到HTML文件也可以查看效果: <html> <head> <meta ...

随机推荐

  1. mysql5.6 的st_distance 实现按照距离远近排序。

    当前所处在的位置(113.858202 , 22.583819 ),需要查询我附近1000米内的小区,并安装由近到远的顺序排列  SELECT s.id,s.name,s.lng,s.lat, rou ...

  2. JavaWeb学习笔记(十四)—— 使用JDBC处理MySQL大数据

    一.什么是大数据 所谓大数据,就是大的字节数据,或大的字符数据.大数据也称之为LOB(Large Objects),LOB又分为:clob和blob,clob用于存储大文本,blob用于存储二进制数据 ...

  3. HDU6464 (权值线段树)-(查找区间第k1小于第k2小之间的和)

    http://acm.hdu.edu.cn/showproblem.php?pid=6464 不理解先看博客:https://blog.csdn.net/g21glf/article/details/ ...

  4. Ibatis批量处理

    1.插入 <insert id="insTable" resultClass="int"> INSERT INTO [dbo].[table] ([ ...

  5. Kafka消费不到数据的特殊情况

    我大约是把kafka消费不到数据的特殊情况都经历了一遍了吧= =. kafka消费不到数据的原因,首先检查配置之类的,如是否设置了group.id,对应的topic是否正确等等,这些不多说. 下面是我 ...

  6. java多线程-Lock

    大纲: Lock接口 synchronized&Lock异同 一.Lock public interface Lock { void lock(); void lockInterruptibl ...

  7. linux 安装maven,注意下载-bin.tar.gz文件

    先去http://maven.apache.org/download.cgi下载对应的版本然后放到服务器上/var/local文件夹下面, 此处使用的是apache-maven-3.5.2-bin.t ...

  8. rancher初级(搭建+基本操作+web应用部署)

    Rancher搭建 首先rancher需要安装了docker的linux环境,我的系统版本为 在docker的基础上启动rancher服务器,Rancher 服务器是一个 Docker image,所 ...

  9. 【问题记录】 Linux 安装 apache 遇到的一些问题

    以下为linux上安装apache时自己遇到的一些问题,记录在这,以后遇到时也会不定时更新... 一.安装Apache提示APR not found的解决办法 解决方法: 1. 网站 http://a ...

  10. matlab遍历文件制作自己的数据集 .mat文件

    原文作者:aircraft 原文地址:https://www.cnblogs.com/DOMLX/p/9115788.html 看到深度学习里面的教学动不动就是拿MNIST数据集,或者是IMGPACK ...