在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. 动态链接库中函数的地址确定---PLT和GOT [转]

    前面写过动态链接库 延迟绑定的一篇博文,那篇文章我非常喜欢,但是当时刚搞清楚,自己写的比较凌乱,我最近学习了Ulrich Drepper的How to write share library,学习了几 ...

  2. Understanding postgresql.conf : log*

    After loooong pause, adding next (well, second) post to the “series“. This time, I'd like to describ ...

  3. #linux包之lsof之lsof命令

    2015/3/18查漏补缺,反复练习命令,有不明白或疑问的地方直接看man手册页,英文解释的比较清楚 man lsof 已阅 概述 [root@localhost ~]# rpm -qa|grep l ...

  4. unity, 由5.2.1f1升级到5.3.5f1,2d物理不正常解法

    由5.2.1f1升级到5.3.5f1,物理不正常. 最后发现问题出在我的游戏中的下面一段代码:   Vector2 targetPosition=...;   Vector2 targetVeloci ...

  5. JS 阻止浏览器默认行为和冒泡事件

    JS 冒泡事件   首先讲解一下js中preventDefault和stopPropagation两个方法的区别: preventDefault方法的起什么作用呢?我们知道比如<a href=& ...

  6. C# toString()转换详细(转)

    文章转自:http://blog.csdn.net/xiaoguang44/article/details/6988418 字符型转换为字符串 // C 货币 2.5.ToString("C ...

  7. SQL中 EXCEPT、INTERSECT用法

    EXCEPT 返回两个结果集的差(即从左查询中返回右查询没有找到的所有非重复值). INTERSECT 返回 两个结果集的交集(即两个查询都返回的所有非重复值). UNION返回两个结果集的并集. 语 ...

  8. mapreduce精简概括--转

    mapreduce精简概括 We want to count all the books in the library. You count up shelf #1, I count up shelf ...

  9. jQuery点击图片弹出放大可拖动图片查看

    CSS代码: .popup-bigic { position: absolute; ; ; background: #eee; overflow: hidden; ; } .popup-bigic . ...

  10. Tomcat连接池

    步骤1: 找到Tomcat安装目录下的context.xml文件,在config目录下.在<Context/>节点下加入: <Resource name="jdbc/myt ...