H5 学习之旅-H5表格（7）
表格语法
table：简历表格
captian：表格标题
th：表格行表头
tr：表格行
td:单元格
thead：表格页眉
tfoot：表格页脚
tbody:表格主体
col：列属性
！！！代码实例
带标题的表格
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>H5表格</title>
</head>
<body><p>表格</p><table border="1"><caption>表格</caption><tr><th>单元</th><th>单元</th><th>单元</th></tr><tr><td>单元格1</td><td>单元格2</td><td>单元格3</td></tr><tr><td>单元格1</td><td>单元格2</td><td>单元格3</td></tr></table>
</body>
</html>效果图
带标签的表格
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>H5表格</title>
</head>
<body><p>表格</p><table border="1"><caption>表格</caption><tr><th>单元</th><th>单元</th></tr><tr><td><ul><li>香蕉</li><li>香蕉</li><li>香蕉</li></ul></td><td>我要吃药</td></tr></table>
</body>
</html>效果图
单元格内边距
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>H5表格</title>
</head>
<body><p>表格</p><table border="1"><caption>表格</caption><tr><th>单元</th><th>单元</th></tr><tr><th>单元</th><th>单元</th></tr></table><br/><table border="1" cellpadding="10"><caption>表格</caption><tr><th>单元</th><th>单元</th></tr><tr><th>单元</th><th>单元</th></tr></table>
</body>
</html>效果图
单元格外边距
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>H5表格</title>
</head>
<body><p>表格</p><table border="1"><caption>表格</caption><tr><th>单元</th><th>单元</th></tr><tr><th>单元</th><th>单元</th></tr></table><br/><table border="1" cellspacing="10"><caption>表格</caption><tr><th>单元</th><th>单元</th></tr><tr><th>单元</th><th>单元</th></tr></table>
</body>
</html>效果图
设置单元格背景颜色是bgcolor，设置背景图片是background
<script type="text/javascript"> $(function () { $('pre.prettyprint code').each(function () { var lines = $(this).text().split('\n').length; var $numbering = $('<ul/>').addClass('pre-numbering').hide(); $(this).addClass('has-numbering').parent().append($numbering); for (i = 1; i <= lines; i++) { $numbering.append($('<li/>').text(i)); }; $numbering.fadeIn(1700); }); }); </script>
H5 学习之旅-H5表格（7）相关推荐
- H5学习之旅-H5列表（8）
列表的基本语法 ol:有序列表 ul:无序列表 li:列表项 dl:列表 dt:列表项 dd:列表描述 常用列表 1.无序列表:使用标签 ul,li 属性:disc(默认实心圆) circle (空心 ...
- H5学习之旅-H5的表单（11）
H5的表单元素 form:表单 input:输入域,type属性可以设置text,password,button等不同的属性 textarea:文本域 lable:控制标签 fieldset:定义域 ...
- H5学习之旅-H5的样式（5）
样式的引入方式 外部样式表 link rel = "stylesheet" type = "text/css" href = "mystyle.css ...
- H5学习之旅-H5的基本标签（2）
H5的标签和html的标签没什么区别,主要介绍H5的基本标签 1.基础标签header和body,header的<title>元素主要是显示在标签页面里面,以及设置使用的语言和编码格式.b ...
- 黑马h5学习代码_如何零基础制作酷炫实用的H5页面
H5页面已经成为了当下移动端主要的宣传方式,一个好的H5页面有极高的营销价值,无论是企业还是个人都非常需要.制作一个炫酷的H5页面一定要会写代码吗,下面千锋网络营销小编就给大家分享如何零基础制作炫酷实 ...
- 【h5文件读取】h5文件读取——深度学习数据集常用
数据集的常用格式:h5 深度学习搞了很长时间,其中开源的代码中经常用到大型数据集,里面的数据类型是h5格式,这个格式困扰我挺长时间,因为隔离还拿不到实验室的程序,只好硬着头皮再琢磨一遍. 关于h5文件 ...
- html5生成excel,H5纯前端生成Excel表格
H5纯前端生成Excel表格方法如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 var arr = [ 14 { 15 "姓名":"喵喵喵" ...
- H5学习之路之audio音频播放
为什么突然写这个呢?很简单,H5学习本身应该是一个系统的学习过程,虽然很多的东西都是会的,但是没有总结过,也不知道自己究竟对H5了解多少,爱有多深,所以在这里装作自己好像对H5很了解的样子,写一个记录 ...
- 口袋之旅html5超强账号,口袋之旅h5高级账号，h5裂空座多少高级狩猎卷
GBA战斗手游<口袋妖怪复刻>凭借集捕捉探索和宠物养成于一身的特点,口袋之旅h5高级狩猎场保底多少积累了超高人气和优质的游戏品质,成为众多玩家的力捧新作.为了让玩家能尽情捕捉小精灵,增强自 ...
- 学习开发h5培训课程的技巧有哪些？H5学习路线
学习开发h5培训课程的技巧有哪些?看看H5学习路线是怎样的. 如何高效学习web前端开发? 课程中先要学的是学HTML.CSS,这两个东西是一套的,非常容易理解,随着web移动端开发的大趋势,HTML ...
最新文章
- Java问题排查工具清单!
- WijmoJS 使用Web Workers技术，让前端 PDF 导出效率更高效
- 阅读一款3D引擎的方法备忘
- 46.一个例子了解C++中异常处理
- 平安人寿福利BUFF重磅推介 | 北京研发中心职位速递
- VTK：PolyData之ExternalContour
- [基础题]2.（*）利用接口做参数，写个计算器，能完成加减乘除运算。
- Eclipse python 开发环境配置
- 睡眠 应该用 a加权 c加权_在神经网络中提取知识：学习用较小的模型学得更好...
- java分享知识点_Java基础知识点整理(一)
- leetcode954. Array of Doubled Pairs
- （转载）VS2010/MFC编程入门之五十二（Ribbon界面开发：创建Ribbon样式的应用程序框架）...
- mysql中时间处理函数_基于mysql时间处理函数的应用详解
- JAVA多线程之男朋友和女朋友之间的故事
- Groovy从入门到精通
- 目前的物联网产品，主要有哪些？
- excel中删除重复数据
- 苹果真伪查询_苹果自研M1芯片Mac电脑开启预售！该不该冲？
- win7计算机本地用户和组,Win7旗舰版找不到本地用户和组如何解决
- 8口千兆二层非网管工业以太网交换机千兆8口工业交换机