html5之表格元素
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格元素</title>
</head>
<body>
<h4>设置表格背景色为黑色,单元格间距为1px<br/>通过设置背景色为黑色可以实现边框效果</h4>
<table style="background-color: #cccccc;border-collapse: separate;border-spacing: 1px;text-align: center" >
<caption><b>疯狂java体系图书</b></caption>
<!--定义所有列的背景色都是白色-->
<colgroup style="background-color: white">
<!--设置第一列宽160px-->
<col style="width: 160px"/>
<!--定义横跨两列,设置这两列各宽100px-->
<col span="2" style="width:100px"/>
</colgroup>
<thead>
<tr>
<th>书名</th>
<th>作者</th>
<th>价格</th>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="3" style="text-align: right">现总计:2本图书</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>疯狂java讲义</td>
<td>李刚</td>
<td>109</td>
</tr>
<tr>
<td>轻量级Java EE企业应用实战</td>
<td>李刚</td>
<td>89</td>
</tr>
</tbody>
</table>
</body>
</html>
<colgroup>组织多个<col/>元素,指定属性对它包含的所有<col/>元素有效,可指定id,style,class等通用属性
<col/>用于制定表格一列或者多列的整体属性,span属性指定受影响列数,可指定id,style,class等通用属性
设置表格背景色为黑色,单元格间距为1px
通过设置背景色为黑色可以实现边框效果
| 书名 | 作者 | 价格 |
|---|---|---|
| 现总计:2本图书 | ||
| 疯狂java讲义 | 李刚 | 109 |
| 轻量级Java EE企业应用实战 | 李刚 | 89 |
html5之表格元素的更多相关文章
- 第六十三节,html表格元素
html表格元素 学习要点: 1.表格元素总汇 2.构建表格解析 本章主要探讨HTML5中表格元素的用法.表格的主要用途是以网格的形式显示二维数据. 一.表格元素总汇 ...
- html5权威指南:表格元素
第十一章:表格元素 ...
- HTML5:表格
表格的作用是显示二维数据.在HTML5中不再同意用表格控制页面内容的布局.而是採用新增的CSS表格特性(这里不涉及CSS,将在后面介绍). 以下主要介绍用于制作表格的HTML元素. 构建表格 表格的基 ...
- html5-5 HTML5表单元素和内嵌框架
html5-5 HTML5表单元素和内嵌框架 一.总结 一句话总结:单选框和多选框选的时候外面加label就可以实现选后面文字也可以选中了 1.html5如何实现文件上传? 必须加上enctype ...
- html中表格元素的相关总结
表格元素相关总结: 1.在CSS中,内部表元素(如td.tr.col等)生成矩形框,这些矩形框包含内容.内边距和边框,但没有外边距,因此如果定义外边距,浏览器将忽略该定义:对于table元素,外边距有 ...
- HTML5 画布canvas元素
HTML5的canvas元素以及随其而来的编程接口Canvas API应用前景极为广泛.简单地说,canvas元素能够在网页中创建一块矩形区域,这块矩形区域可以成为画布,这其中可以绘制各种图形.可别小 ...
- HTML中表格元素TABLE,TR,TD及属性的语法
table:表格元素及属性 <table width="80%" border="1" cellspacing="1" cellpad ...
- 今天学习了无序列表和有序列表和使用HTML5创建表格
ol建立有序列表,该列表可以用设置type="A/a" 其语法架构为 <ol> <li></li> <li></li> ...
- 415 DOM 查找列表框、下拉菜单控件、对表格元素/表单控件进行增删改操作、创建元素并且复制节点与删除、 对表格操作、通用性和标准的事件监听方法(点击后弹窗效果以及去掉效果)
DOM访问列表框.下拉菜单的常用属性: form.length.options.selectedindex.type 使用options[index]返回具体选项所对应的常用属性:defa ...
随机推荐
- MYSQL数据库学习十二 使用MySQL运算符
12.1 算术运算符 + - * /(DIV) %(MOD) 12.2 比较运算符 > < = <=> != <> >= <= BETWEEN AND ...
- java大数(BigInteger)
JAVA之BigInteger 用Java来处理高精度问题,相信对很多ACMer来说都是一件很happy的事,简单易懂.用Java刷了一些题,感觉Java还不错,在处理高精度和进制转换中,调用库函数的 ...
- 彻底弄懂CommonJS和AMD/CMD!
JS中的模块规范(CommonJS,AMD,CMD),如果你听过js模块化这个东西,那么你就应该听过或CommonJS或AMD甚至是CMD这些规范咯,我也听过,但之前也真的是听听而已. 现在就看看吧, ...
- Java中==与equals()的区别
声明转载来源:http://blog.csdn.net/striverli/article/details/52997927 ==号和equals()方法都是比较是否相等的方法,那它们有什么区别和联系 ...
- android 滑动分页
import android.app.ListActivity;import android.os.Bundle;import android.os.Handler;import android.vi ...
- (转)[置顶] Android APK反编译就这么简单 详解(附图) .
在学习Android开发的过程你,你往往会去借鉴别人的应用是怎么开发的,那些漂亮的动画和精致的布局可能会让你爱不释手,作为一个开发者,你可能会很想知道这些效果界面是怎么去实现的,这时,你便可以对改应用 ...
- sphinx的安装
1.下载sphinx 没想到sphinx3解压后即可: wget http://sphinxsearch.com/files/sphinx-3.0.2-2592786-linux-amd64.tar. ...
- JavaScript Alert 函数执行顺序问题
* { color: #3e3e3e } body { font-family: "Helvetica Neue", Helvetica, "Hiragino Sans ...
- python 操作Memcached
启动Memcached memcached -d -m 10 -u root -l 10.211.55.4 -p 12000 -c 256 -P /tmp/memcached.pid 参数说明: -d ...
- 如何书写高效的css样式
如何书写高效的css样式? 有以下四个关键要素: 1.高效的css 2.可维护的css 3.组件化的css 4.hack-free css 书写高效的css: 1.使用外联样式替代行间样式或内嵌样式 ...