HTML表格-table
表格
表格由 <table> 标签来定义。
每个表格均有若干行(由 <tr> 标签定义),每行被分割为若干单元格(由 <td> 标签定义)。
字母 td 指表格数据(table data),即数据单元格的内容。
数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。
例如,要画出如下表格:
分析: 1.分析行,每行是一个tr标签
2.从第一行开始,看每行有几个单元格,几个单元格就是几个td标签
3.如果是占用空间为1行1列,省略行数,直接为<td></td>。
上图的代码如下
<body>
<table width="400" height="400" border="2">
<!-- 第1行 -->
<tr>
<td colspan="4" bgcolor="aqua"></td>
</tr>
<!-- 第2行 -->
<tr>
<td rowspan="4" bgcolor="antiquewhite"></td>
<td colspan="3" bgcolor="antiquewhite"></td>
</tr>
<!-- 第3行 -->
<tr>
<td rowspan="3" bgcolor="aquamarine"></td>
<td colspan="2" bgcolor="aquamarine"></td>
</tr>
<!-- 第4行 -->
<tr>
<td rowspan="2" bgcolor="bisque"></td>
<td bgcolor="bisque"></td>
</tr>
<!-- 第5行 -->
<tr>
<td></td>
</tr>
</table>
</body>
2018-07-30
HTML表格-table的更多相关文章
- jQuery动态对表格Table进行添加或删除行以及修改列值操作
jQuery,不仅可以以少量的代码做很多操作,而且兼容性好(各种浏览器,各种版本). 下面用jQuery动态对表格Table进行添加或删除行以及修改列值操作 1.jQuery代码 <script ...
- BootStrap入门教程 (二) :BASE CSS(排版(Typography),表格(Table),表单(Forms),按钮(Buttons))
上讲回顾:Bootstrap的手脚架(Scaffolding)提供了固定(fixed)和流式(fluid)两种布局,它同时建立了一个宽达940px和12列的格网系统. 基于手脚架(Scaffoldin ...
- html表格table设置边框
对于很多初学HTML的人来说,表格<table>是最常用的标签了,但对于表格边框的控制,很多初学者却不甚其解. 一般我们用表格的时候总会给它个border属性,比如:<table b ...
- css列表list、表格table
列表list,无序列表ul,有序列表ol 1.列表项样式list-style-type 无列表默认为dist实心圆,有序列表默认为decimal阿拉伯数字(前面不带0) 其他无序列表常用none无样式 ...
- 表格(Table)隔行变色
在ASP.NET的Repeater控件,实现隔行变色,是极简单的事情.因为它有ListItemType.Item和ListItemType.AlternatingItem模版.如果在普通的表格(Tab ...
- pre,html转义,abbr缩写,表格table
<pre></pre>预定义文本标签pre(保留换行和空格) <sdds>对html转义 <abbr title="sddsdsds"&g ...
- 表格Table宽度设置无效的解决方法
表格Table宽度设置无效的解决方法 bootstrap中使用table时发现不管用width赋值方式都无法改变table>td的宽度 解决方法: 设置table:table-layout:fi ...
- 2017.9.15 HTML学习总结---表格table
2.7 表格<table>的属性: 属性 用途 width 表格宽度 height 表格高度 align 表格水平对齐 border ...
- jQuery 选择表格(table)里的行和列及改变简单样式
本文只是介绍如何用jQuery语句对表格中行和列进行选择以及一些简单样式改变,希望它可以对jQuery表格处理的深层学习提供一些帮助jQuery对表格(table)的处理提供了相当强大的功能,比如说对 ...
- amazeui学习笔记--css(HTML元素5)--表格Table
amazeui学习笔记--css(HTML元素5)--表格Table 一.总结 1.基本样式:am-table:直接模块名 <table class="am-table"& ...
随机推荐
- Android进入页面开始就自动弹出软键盘
EditText edittext = (EditText)findViewById(R.id.edittext); edittext.setFocusable(true); edittext ...
- ES入门——数组的扩展
1.Array.from() 该方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象,包括ES6新增的数据结构Set和Map.下面是 ...
- Python学习系列----第四章 函数
4.1 函数定义 函数是python中重要的工具.函数用关键字 def 来定义.def 关键字后跟一个函数的标识符名称,然后跟一对圆括号.圆括号之中可以包括一些变量名,该行以冒号结尾.接下来是一块 ...
- DELPHI SOKET 编程--使用TServerSocket和TClientSocket
本文采用delphi7+TServerSocket+TClientSocket; 笔者在工作中遇到对局域网中各工作站与服务器之间进行Socket通信的问题.现在将本人总结出来的TServerSocke ...
- PPTP has become obsolete
https://www.ovpn.com/en/blog/pptp-has-become-obsolete/ PPTP has become obsolete What is PPTP? PPTP s ...
- Spring注解开发-全面解析常用注解使用方法之组件注册
目录 1. @Configuration 2. @ComponentScan excludeFilters includeFilters 使用自定义TypeFilter 3. @Bean @Scope ...
- Codeforces Round #239 (Div. 1)C, 407C
题目链接:http://codeforces.com/contest/407/problem/C 题目大意:给一个长度为n的数列,m次操作,每次操作由(li, ri, ki)描述,表示在数列li到ri ...
- win10 x64 注册ZQDeviceOcx.ocx控件
正常的方式在32位系统下可行, 但是在64位系统下是不可行的. 在64位系统中正确的注册步骤是: 1. 将对应的ocx和dll放到C:\Windows\SysWOW64目录下. 2. 然后找到C:\W ...
- springmvc jar包下载 提供地址
转载:https://blog.csdn.net/qq_31307253/article/details/80622936 spring:http://maven.springframework.or ...
- Hibernate映射Map属性2
Hibernate在映射Map属性时生成映射文件.需要注意的一些地方.下面是我的一个例子. Java类如下 public class NameAndNumber { private Integer i ...