<style>

table{ border-collapse:collapse; margin:0 auto;}

table tr td{ border:1px solid #000; line-height:40px; text-align:center;color:red;}

 </style>

</head>

<body>

  <table  width="300">

    <caption>直接使用表的 "border" 属性设置边框线</caption>

      <tr>

	    <td colspan='4'>统称分类</td>

	  </tr>

	  <tr>

	     <td rowspan='2'>品质一级</td><td>谷类</td><td>蔬菜</td><td>肉类</td>

	  </tr>

	  <tr>

	     <td>小米</td><td>黄瓜</td><td>牛肉</td>

	  </tr>

	  <tr>

	     <td rowspan='2'>品质一级</td><td>大米</td><td>西红柿</td><td>鱼肉</td>

	  </tr>

	  <tr>

	     <td>绿豆</td><td>南瓜</td><td>鸡肉</td>

	  </tr>

   </table>

</body>

</html>

　　

border-collapse：separate | collapse | inherit

　　border-collapse 用于表格属性, 表示表格的两边框合并为一条

separate 默认不合并

collapse 合并为一条 如上图

rowspan 跨行

colspan 跨列

表格table样式布局设置的更多相关文章

  1. 表格-table 样式

    .table: 表格基本样式 .table-dark:表格显示为黑色 .thead-light: 表头显示颜色跟亮 .thead-dark:表头显示为黑色 .table-striped:表格以条纹形式 ...

  2. css table样式

    1.table样式首先设置表格边框,属性设置表格的边框是否被合并为一个单一的边框. table{ border-collapse: collapse; border-spacing: 0;} 2.固定 ...

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

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

  4. JQuery EasyUI DataGrid根据条件设置表格行样式(背景色)

    1.javascript定义函数返回样式 <script type="text/javascript"> //根据条件设置表格行背景颜色 function setRow ...

  5. CSS：表格样式（设置表格边框/文字/背景的样式）

    使用CSS能够制作出十分精美的表格. 代码整理自w3school:http://www.w3school.com.cn 效果图: 代码: <!DOCTYPE html PUBLIC " ...

  6. CSS设置表格TD宽度布局

    使用表格布局时,对单元格的宽度控制很伤脑筋,所以查阅资料整理如下: 一.表格布局table-layout 语法: table-layout : auto | fixed 取值: auto  : 大多数 ...

  7. html table表格导出excel的方法 html5 table导出Excel HTML用JS导出Excel的五种方法 html中table导出Excel 前端开发 将table内容导出到excel HTML table导出到Excel中的解决办法 js实现table导出Excel，保留table样式

    先上代码   <script type="text/javascript" language="javascript">   var idTmr; ...

  8. Element-UI中关于table表格的样式操作

    项目中使用到element-ui组件库,经常需要操作表格,编辑样式的过程中遇到一些问题,官网针对table给出了很多的api,自己可以自定义,基本能满足产品需求,但是没有给出具体的案例,网上的资料也比 ...

  9. Table样式设置

    <table class="listTable"> <tr><th width="40px">序号</th>&l ...

随机推荐

  1. centos 7 修改主机名称

    hostnamectl --static set-hostname <host-name> 参考资料 http://www.centoscn.com/CentOS/config/2014/ ...

  2. 征服 Redis + Jedis + Spring （一）—— 配置&常规操作（GET SET DEL）

    有日子没写博客了,真的是忙得要疯掉. 完成项目基础架构搭建工作,解决了核心技术问题,接着需要快速的调研下基于Spring框架下的Redis操作. 相关链接: 征服 Redis 征服 Redis + J ...

  3. 读&lt;大数据日知录:架构与算法&gt;有感

    前一段时间, 一个老师建议我能够学学 '大数据' 和 '机器学习', 他说这必定是今后的热点, 学会了, 你就是香饽饽.在此之前, 我对大数据, 机器学习并没有非常深的认识, 总觉得它们是那么的缥缈, ...

  4. ASP.NET 未被授权访问所请求的资源。请考虑授予 ASP.NET 请求标识访问此资源的权限

    开发了一个导入TXT文件的功能,执行过程中出错.提示:.....ASP.NET 未被授权访问所请求的资源.请考虑授予 ASP.NET 请求标识访问此资源的权限.ASP.NET 有一个在应用程序没有模拟 ...

  5. Java中创建线程的两种方式

    创建线程的第一种方式: 创建一个类继承Thread 重写Thread中的run方法 (创建线程是为了执行任务 任务代码必须有存储位置,run方法就是任务代码的存储位置.) 创建子类对象,其实就是在创建 ...

  6. Adobe Flash Platform产品介绍

    解释 adobe flash platform flex是一个免费的开源的框架 该应用程序通常是用在 浏览器和 桌面 AIR中的 了解 flex框架 ,Flex sdk 和adobe flash bu ...

  7. 发布GeoServer后预览提示下载wms文件

    这是因为发布的图层有中文所导致的,只需修改tomcat的server.xml文件 <Connector port="8080" protocol="HTTP/1.1 ...

  8. 无法打开登录所请求的数据库 "XXX"。登录失败。 用户 'NT AUTHORITY\SYSTEM' 登录失败。

    1.打开数据库安全性-登录名 2.选择NT AUTHORITY\SYSTEM右键属性 3.选择服务器角色勾选sysadmin选项保存

  9. com.sun.org.apache.commons.logging.LogConfigurationException: java.lang.NullPointerException

    在日志中, 查看导入的包是否是 import org.apache.commons.logging.Log; import org.apache.commons.logging.LogFactory;

  10. WCF学习系列一_创建第一个WCF服务

    原创作者:灰灰虫的家http://hi.baidu.com/grayworm WCF开发实战系列一:创建第一个WCF服务 在这个实战中我们将使用DataContract,ServiceContract ...