详解HTML中的表格标签
详细代码如下:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>表格制作</title>
</head>
<body>
<table bgcolor="black" width="500px">
<caption style="bold">学生信息</caption>
<thead>
<tr bgcolor="#a9a9a9" height="50px">
<th>姓名</th>
<th>年龄</th>
<th>学校</th>
<th>考试成绩</th>
<th>喜欢水果</th>
<th>经常上的网站</th>
</tr>
</thead>
<tbody>
<tr bgcolor="white" align="center" height="30px">
<td align="left">张三</td>
<td>22</td>
<td>西安工业大学</td>
<td>87</td>
<td>桃子</td>
<td>
<a href="http://www.baidu.com/">百度 </a>
<a href="http://www.sina.com/">新浪</a>
</td>
</tr>
<tr bgcolor="white" align="center">
<td align="left">李四</td>
<td>23</td>
<td rowspan="2">上海交通大学</td>
<td>85</td>
<td>苹果</td>
<td>
<a href="https://www.taobao.com/">淘宝 </a>
<a href="https://www.jd.com/">京东</a>
</td>
</tr>
<tr bgcolor="white" align="center">
<td align="left">王刚</td>
<td>45</td>
<!-- <td>上海海洋大学</td> -->
<td>86</td>
<td>香蕉</td>
<td>
<a href="http://www.163.com/">网易</a>
<a href="http://www.sina.com/">新浪</a>
</td>
</tr>
</tbody>
<tfoot>
<tr bgcolor="white">
<td >总分</td>
<td></td>
<td></td>
<td align="center">258</td>
<td></td>
<td></td>
</tr>
</tfoot>
</table>
</body>
</html>
注意事项:
1.宽度和高度属性
可以给table和td标签使用
2.水平对齐和垂直对齐
水平对齐可以给table和td使用
垂直对齐只能给tr和td标签使用
3.外边距和内边距属性
只能给table使用
4.表格分类
表格的标题
表格的表头信息
表格的主题信息
表格的叶尾信息
//必须写在table标签中,紧跟在table后面
5.单元格合并(添加td属性)
colspan="x"水平合并X个单元格,同时删除多余的
rowspan="x"垂直合并X个单元格,同时删除多余的
单元格都是向后或者想下合并的
详解HTML中的表格标签的更多相关文章
- 详解WordPress中简码格式标签编写的基本方法
WordPress 简码是一种类似于论坛标签的东西,格式类似于把尖括号换成中括号的 Html 标签.简码很多人叫做短代码,但官方的翻译应该是简码,在这里纠正一下. 简码的开发的逻辑比较简单,主要就是添 ...
- Usermod 命令详解 ------工作中修改shell时用 usermod -s /bin/csh home
Usermod 命令详解 2012-09-11 11:01:36 标签:usermod 原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.htt ...
- java 乱码详解_jsp中pageEncoding、charset=UTF -8"、request.setCharacterEncoding("UTF-8")
http://blog.csdn.net/qinysong/article/details/1179480 java 乱码详解__jsp中pageEncoding.charset=UTF -8&quo ...
- CSS学习笔记(9)--详解CSS中:nth-child的用法
详解CSS中:nth-child的用法 前端的哥们想必都接触过css中一个神奇的玩意,可以轻松选取你想要的标签并给与修改添加样式,是不是很给力,它就是“:nth-child”. 下面我将用几个典型的实 ...
- 用IDEA详解Spring中的IoC和DI(挺透彻的,点进来看看吧)
用IDEA详解Spring中的IoC和DI 一.Spring IoC的基本概念 控制反转(IoC)是一个比较抽象的概念,它主要用来消减计算机程序的耦合问题,是Spring框架的核心.依赖注入(DI)是 ...
- 使用IDEA详解Spring中依赖注入的类型(上)
使用IDEA详解Spring中依赖注入的类型(上) 在Spring中实现IoC容器的方法是依赖注入,依赖注入的作用是在使用Spring框架创建对象时动态地将其所依赖的对象(例如属性值)注入Bean组件 ...
- (数据科学学习手札140)详解geopandas中基于pyogrio的矢量读写引擎
本文示例代码已上传至我的Github仓库https://github.com/CNFeffery/DataScienceStudyNotes 1 简介 大家好我是费老师,前不久我在一篇文章中给大家分享 ...
- jQuery:详解jQuery中的事件(二)
上一篇讲到jQuery中的事件,深入学习了加载DOM和事件绑定的相关知识,这篇主要深入讨论jQuery事件中的合成事件.事件冒泡和事件移除等内容. 接上篇jQuery:详解jQuery中的事件(一) ...
- 图文详解Unity3D中Material的Tiling和Offset是怎么回事
图文详解Unity3D中Material的Tiling和Offset是怎么回事 Tiling和Offset概述 Tiling表示UV坐标的缩放倍数,Offset表示UV坐标的起始位置. 这样说当然是隔 ...
随机推荐
- 增加,删除GMS包
1. device/hiteq/vtab_1050_standard/httek.mk BUILD_GMS:=yes GMS_VARIANT:=mini 2. rm out/target/produc ...
- TModJS:使用tmodjs
ylbtech-TModJS:使用tmodjs 1.返回顶部 1. 1.安装 npm install -g tmodjs 2.配置 我的模板都放在tpl文件夹中,htmls用于存放模板页面,每一个后缀 ...
- .NETFramework:Timers
ylbtech-.NETFramework:Timers 1.返回顶部 1. #region 程序集 System, Version=4.0.0.0, Culture=neutral, PublicK ...
- Python的中文处理
一.使用中文字符 在python源码中如果使用了中文字符,运行时会有错误,解决的办法是在源码的开头部分加入字符编码的声明,下面是一个例子: #!/usr/bin/env python # -*- co ...
- TP5之一次选择多张图片并预览
点击选择图片(可选多张),确定后将选择的图片显示在页面上,已经选择的图片也可以删除,点击提交将图片提交给后台. 1.效果图 2.code 用input标签并选择type=file,记得带上multip ...
- OpenCV入门指南
http://blog.csdn.net/morewindows/article/details/8225783/ http://blog.csdn.net/poem_qianmo/article/d ...
- 51nod 1416【DFS】
思路: 暴力整个图,以这个为起点,然后看一下有没有找到一条路是会指向自己且元素个数>=4: #include <bits/stdc++.h> using namespace std; ...
- laravel MVC分布及数据库配置
laravel MVC分布 M app\Http\Middleware V resources\views C app\Http\Controllers 数据库配置 目录 config\datab ...
- unity3d 在UGUI中制作自适应调整大小的滚动布局控件
http://blog.csdn.net/rcfalcon/article/details/43459387 在游戏中,我们很多地方需要用到scroll content的概念:我们需要一个容器,能够指 ...
- Kibana: Unknown error while connecting to Elasticsearch
如果访问不通,可能是网络代理的问题,注意查看/etc/profile中是否设置了相关的代理. 注意修改代理后,应该执行 . /etc/profile 使配置文件立即生效.