在Html中使用table是网页制作中必不可缺的一部分,如果直接给css设置table里面的td边框为1像素的话,那么实际我们从网页上看到的效果却不是1像素。

那么我们怎么用css让table的边框为1像素呢?

其实很简单,给table使用css样式 border-collapse: collapse;

这个样式的意思就是“为表格设置合并边框模型”

这个属性经测试,支持一下浏览器:

      

下面我写一个案例

CSS

/*重点就是要在table上加border-collapse: collapse;这个样式,这个样式是合并边框模型的意思*/
table{border-collapse: collapse;width:100%;}
tr{}
td{border: 1px solid #936943;height:40px;}

HTML

<table>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>

css如何让表格table的边框为1像素呢的更多相关文章

  1. html表格table设置边框

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

  2. 关于表格table嵌套,边框合并问题的解决方法,table嵌套(转)

    原文地址:http://www.cnblogs.com/zhangym118/archive/2016/05/16/5496931.html [问题] 外层table与内层table嵌套,内外表格都需 ...

  3. 让表格table呈现边框,不用给tr、td加边框的写法

    <table width="100%" cellspacing="1" cellpadding="1" bgcolor="# ...

  4. css列表list、表格table

    列表list,无序列表ul,有序列表ol 1.列表项样式list-style-type 无列表默认为dist实心圆,有序列表默认为decimal阿拉伯数字(前面不带0) 其他无序列表常用none无样式 ...

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

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

  6. BootStrap入门教程 (二) :BASE CSS(排版(Typography),表格(Table),表单(Forms),按钮(Buttons))

    上讲回顾:Bootstrap的手脚架(Scaffolding)提供了固定(fixed)和流式(fluid)两种布局,它同时建立了一个宽达940px和12列的格网系统. 基于手脚架(Scaffoldin ...

  7. __x__(40)0909第五天__表格 table 的 css 样式 美化

    如果就向下面的代码那样,不写 tbody , 则浏览器自添加 tbody , 并将所有的 tr 移入 tbody 意味着 tr 并非 table 的子元素,而是 tbody 的子元素. 所以 以后编写 ...

  8. amazeui学习笔记--css(HTML元素5)--表格Table

    amazeui学习笔记--css(HTML元素5)--表格Table 一.总结 1.基本样式:am-table:直接模块名  <table class="am-table"& ...

  9. 表格table嵌套,边框合并问题

    [问题] 外层table与内层table嵌套,内外表格都需边框时,设置“border=1”,但边框会重复,造成某些地方边框粗,有些地方边框细的问题.   [解决办法]: 外表格样式: <tabl ...

随机推荐

  1. phpstorm用正则删除PHP代码空行小技巧

    有很多小伙伴会遇到代码空行特别多,但是一行一行删除肯定很烦躁,这时候就需要用到批量删除空行. 怎么批量删除空行呢? 我的办法是用正则把所有空行找到,然后一键全部替换. 首先把Match Case和Re ...

  2. Java 标准日志工具 Log4j 的使用(附源代码)

    源代码下载 Log4j 是事实上的 Java 标准日志工具.会不会用 Log4j 在一定程度上可以说是衡量一个开发人员是否是一位合格的 Java 程序员的标准.如果你是一名 Java 程序员,如果你还 ...

  3. Oracle Enterprise Manager Cloud Control 12c的安装

    这里,我介绍的是Cloud Control 12c的安装.之前的版本叫Grid Control,这也是11g里面的叫法.在我写这篇博客时,Cloud Control 13c已经出来了,这个版本后续我再 ...

  4. XML 命名空间(XML Namespaces)

    XML 应用程序 XML CDATA XML 命名空间提供避免元素命名冲突的方法. 命名冲突 在 XML 中,元素名称是由开发者定义的,当两个不同的文档使用相同的元素名时,就会发生命名冲突. 这个 X ...

  5. xfs文件系统

    引用http://blog.chinaunix.net/uid-522675-id-4665059.html xfs文件系统使用总结 1.3 xfs相关常用命令xfs_admin: 调整 xfs 文件 ...

  6. oracle OFA

    Optimal Flexible Architecture 完全实现OFA至少需要三个文件系统位于不同的物理设备上,这些物理设备本身没有做条带或镜像.如果这些物理设备要做冗余与吞吐,建议使用一些存储相 ...

  7. bash内部命令-1

    外置命令 date expr seq nohup tput bash内置命令 trap set shopt date Linux时钟分为系统时钟(System Clock)和硬件(Real Time ...

  8. linux包之iproute之ip命令

    [root@localhost ~]# rpm -qf /sbin/ipiproute-2.6.32-31.el6.x86_64ip 是个命令, ip 命令的功能很多!基本上它整合了 ifconfig ...

  9. A javascript library providing cross-browser, cross-site messaging/method invocation. http://easyxdm.net

    easyXDM - easy Cross-Domain Messaging easyXDM is a Javascript library that enables you as a develope ...

  10. CentOS6.4系统启动失败故障排查

    转:http://www.centoscn.com/CentosBug/osbug/2014/1028/4011.html 操作系统启动失败如下图报错: 故障现象: 从图中可以看到,操作系统启动的过程 ...