HTML高级标签之表格标签

前面学习了一下HTML的经常使用标签, 今天開始高级标签之路!

一.表格标签

1.作用: 创建一张表格

2.各属性作用:

<caption> </caption>

3.代码演示样例:

<!DOCTYPE html>

<html>

  <head>

    <title>表格的应用</title>

	<meta charset="utf-8">

    <meta name="keywords" content="keyword1,keyword2,keyword3">

    <meta name="description" content="this is my page">

    <meta name="content-type" content="text/html; charset=UTF-8">

    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

  </head>

  <body>

    <a href="Main.html">返回主页</a>

    <!-- table: 表格标签. cellspacing:单元格边距. cellpadding:单元格间距 -->

    <table border="1" width="400" align="center" cellspacing="0" cellpadding="0">

    <caption align="center"> <!-- caption: 置于table标签内部, <tr>标签之前, 未设置特定的位置时,会随着表格的移动而移动 -->

    <h1>我的表格</h1>

    </caption>

    <tr>

    	<th>编号</th> <!-- 与<td>标签唯一不同: 加粗居中 -->

    	<th>姓名</th>

    	<th>性别</th>

    	<th>职务</th>

    	<th>手机</th>

    </tr>

    <tr>

    	<td>1</td>

    	<td>老大</td>

    	<td>男</td>

    	<td>董事长</td>

    	<td>18910504201</td>

    </tr>

    <tr>

    	<td>2</td>

    	<td>老二</td>

    	<td colspan="1" rowspan="3" align="center">女</td> <!-- colspan: 规定单元可横跨的列数. rowspan: 规定单元格可横跨的行数,

    																	这两种属性使用时, 要将被合并的单元格删除, 否则会出现单元

    																	格被挤出 -->

    	<td>总经理</td>

    	<td>133111111111</td>

    </tr>

     <tr>

    	<td>3</td>

    	<td>老三</td>

    	<td colspan="1" rowspan="2" align="center">副总</td>

    	<td>13322222222</td>

    </tr>

     <tr>

    	<td>4</td>

    	<td>老四</td>

    	<td>13333333333</td>

    </tr>

     <tr>

    	<td>5</td>

    	<td>老五</td>

    	<td>男</td>

    	<td>总监</td>

    	<td>13344444444</td>

    </tr>

    </table>

  </body>

</html>

4.执行结果

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvYW5pZzIwMTQ=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="">

HTML高级标签之表格标签的更多相关文章

Day46（列表标签，表格标签，表单标签，css的引入方式，css选择器）
一.列表标签列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: ul:unordered list,“无序列表”的意思. li:lis ...
HTML常用标签与表格标签
超链接标签: <a href="超链接地址" target="_blank">超链接的文字</a> _blank或new是在新网页中打开 ...
HTML核心标签之表格标签(一)
表格的基本语法: <body> <table> <tr><td></td><td></td></tr> ...
HTML-常用标签与表格标签
超链接标签: <a href="超链接地址" target="_blank">超链接的文字</a> _blank或new是在新网页中打开 ...
HTML入门(转义字符、行内样式和块级元素、定位、锚点、跑马灯标签、图片标签、表格标签的讲解)
一.转义字符由特殊字符包裹的文本会当做标签去解析对应不换行空格对应全角空格 em是字体排印学的计量单位,相当于当前指定的点数.其占据的宽度正好是1个中文宽度,而且基本上不受字体影响.<对应 ...
HTML基本标签，表格标签，框架标签
1.html简介 1.1什么是html html全称:Hyper Text Markup Language(超文本标记语言) 备注: a.超文本:页面内可以包含图片.链接,甚至音乐 ...
讲课笔记1——meta标签、表格标签
图片属性:src(source): 图片的来源(路径),可以放置本地图片,也可以放网上的图片的url地址 [相对路径: ./:当前目录 ../:跳出当前目录,到上一 ...
HTML的列表标签和表格标签
网页的列表和表格列表的分类无序列表有序列表自定义列表有序列表 <ol> <li>辽宁</li> <li ...
HTML核心标签之表格标签(二)
基本用法: <ul type="cir"> <li>显示数据</li> <li>显示数据</li> </ul> ...

随机推荐

Gym - 100203A Ariel 暴力+位运算
题意:第i种生物有k[i]个特征,分数是score[i],现在要参加竞赛,报出一种生物a,和一些特征h[i],参加竞赛的所有生物在这些h[i]上面的特征是一样的,a生物有h[i],则所有竞赛的生物都必 ...
HTTP 各种特性应用（一）
一. CORS 预请求允许方法: GET. HEAD. POST 这三个方法不需要预请求. 允许 Content-Type text/plain. multipart/form-data. app ...
c#(asp.net) 如何计算两个日期之间相隔天数
1.DateTime t1 = Convert.ToDateTime("2006-1-6"); DateTime t2 = Convert.ToDateTime("200 ...
sql的四大函数
字符串函数: 1.charindex(字符串表达式 1, 字符串表达式2[,整数表达式]) select charindex('ab','BCabTabD')返回 3 select charindex ...
SQL函数-str()
1 str()函数用于将数值类型数据转换未字符类型. 2 str()函数语法 select str(数字类型的表达式[,表达式总长度][,小数点后面的位数]) 表达式总长度和小数点后面的位数为可选择参 ...
PyCharm激活方法
1.激活码激活 1.修改hosts文件将0.0.0.0 account.jetbrains.com添加到hosts文件最后,windows系统hosts文件路径为:C:\windows\system ...
对比了解Grafana与Kibana的关键差异
对比了解Grafana与Kibana的关键差异 http://www.infoq.com/cn/articles/grafana-vs-kibana-the-key-differences-to-kn ...
python创建多层目录的方式
将 os.mkdir 改成 os.makedirs(opDir) 哈.
hdu4565---So Easy!(矩阵)
Problem Description A sequence Sn is defined as: Where a, b, n, m are positive integers.┌x┐is the ce ...
Java的线程机制
一.Java中实现多线程的两种方式1) 继承Thread类 Thread类包括了包括和创建线程所需的一切东西. Thread 最重要的方法是 run().编写线程程序时须要覆盖 run() 方法,ru ...

HTML高级标签之表格标签

HTML高级标签之表格标签的更多相关文章

随机推荐

热门专题