在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. java的nio之:java的nio系列教程之Scatter/Gather

    一:Java NIO的scatter/gather应用概念 ===>Java NIO开始支持scatter/gather,scatter/gather用于描述从Channel(译者注:Chann ...

  2. 【转】非常适用的Sourceinsight插件,提高效率事半功倍

    原文网址:http://www.cnblogs.com/wangqiguo/p/3713211.html 一直使用sourceinsight编辑C/C++代码,sourceinsight是一个非常好用 ...

  3. Qt QTreeWidget节点的添加+双击响应+删除详解(转)

    QTreeWidget是实现树形结构的类,在很多软件中都可以看到类似树形结构的界面. 我做的一个示例如下图,用来处理图像,最顶层节点是图像的路径名,子节点是图像的各个波段,双击各个波段会显示图像各波段 ...

  4. SyntaxError: Non-ASCII character '\xe6'

    这是编码的问题,在文件第一行加上如下命令即可: #encoding: utf-8

  5. Xcode 7安装KSImageNamed失败解决方法

    ## How do I use it? Build the KSImageNamed target in the Xcode project and the plug-in will automati ...

  6. Postfix 发送邮件流程简析

      PostFix接受和转发邮件的说明 来源ip符合inet_interfaces,收件人域符合mydestination, Postfix将接收到本地. 来源ip符合inet_interfaces, ...

  7. MySQL和MongoDB语句的写法对照

    查询: MySQL: SELECT * FROM user Mongo: db.user.find() MySQL: SELECT * FROM user WHERE name = ’starlee’ ...

  8. AndroidStudio 应用(一)

    1.下载安装,用上vpn了都: 2.配置模拟器,出现问题:VT-x is disabled in the BIOS for both all CPU modes (VERR_VMX_MSR_ALL_V ...

  9. C语言常用的小代码

    圆周率Pi tan(Pi/4)=1 => Pi=4*arctan(1) 反正切函数arctan()在C语言里表示为atan(),为保证精度取圆周率的代码如下: const double Pi = ...

  10. 对 COM+ 组件进行了方法调用,但该组件有一个已被中止的或正在被中止的事务。 (异常来自 HRESULT:0x8004E003)

    错误: 对 COM+ 组件进行了方法调用,但该组件有一个已被中止的或正在被中止的事务. (异常来自 HRESULT:0x8004E003)   解决办法: 程序连接的数据库换到本地.   具体原因没搞 ...