创建一张表格

很多时候我们需要在网页上展示一些数据，使用表格可以很好的来展示数据。

在HTML中<table>标签定义 表格。

<table>

</table>

添加一行

<table>标签相当于定义了一个表格容器。我们现在要创建表格的行，等会我们再创建列。

标签<tr>表示<table>里的行，在<table>里嵌套了几个完整的（拥有开始标签和闭合标签的）<tr>标签就表示这个<table>有几行：

<table>

    <tr></tr>

    <tr></tr>

    ...

</table>

　　

添加一列

在给表格创建了行之后，我们要给表格的行里面添加单元格，标签<td>表示HTML 表格中的标准单元格。

现在我们可以把要显示的内容放到<td>标签里，我们可以看到页面会把标签<td>里的内容呈现在页面上。

为了方便观察表格单元格的情况，我们给table加了border属性。

<table border="1"></table>

[border]属性我们会在后面具体讲解。

加上<td>结构是这样：

<table>

    <tr>

        <td></td>

        <td></td>

        ...

    </tr>

    <tr></tr>

    ...

</table>

　　

添加多行多列

我们已经知道表格是怎样生成的了，我们来尝试下给页面添加一个多行多列的表格吧。

代码内容如下：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>创建一个多行多列的表格</title>

</head>

<body>

<h1>创建一个多行多列的表格</h1>

  <table border="1" wdith= '200' height = '200'>

  <tr><td></td><td></td><td></td></tr>

    <tr><td></td><td></td><td></td></tr>

      <tr><td></td><td></td><td></td></tr>HTML&CSS基础学习笔

  </table>

</body>

</html>

结果如何呢？可以前往http://www.mayacoder.com/lesson/lesson?lesson_id=31&knowledge_id=8 查看答案哦~~~~

HTML&CSS基础学习笔记—创建列表的更多相关文章

  1. HTML&CSS基础学习笔记1.16-单元格间距和表格主体

    上一篇讲html学习笔记,讲过了合并单元格,那么今天就来介绍下如何控制单元格的间距,以及表格主体的相关知识. 单元格间距 在上个知识点的显示结果中你可能发现了,单元格与单元格之间有一小段空白.这是由& ...

  2. HTML&CSS基础学习笔记1.13—无序列表

    无序列表 有时我们的工作繁忙,杂事很多,怕忘记,就会把事情一件件列出来,防止忘记. 它们的排列顺序对于我们来说并不重要,可以随意调换,我们将它称为无序列表,HTML里用<ul>标签来表示无 ...

  3. HTML&CSS基础学习笔记1.14—有序列表及列表嵌套

    我们上篇讲到了无序列表,那么今天就来看看有序列表和他们的组合嵌套使用吧. 有序列表 现在我们要做那堆杂事了,但是发现这么多杂事,先做哪个好呢?于是我们给这堆杂事弄个优先级排序,让我们能够按照顺序做下去 ...

  4. CSS基础学习笔记

    一. CSS介绍 1. CSS概述:CSS(Cascading Style Sheets)指层叠样式表,极大提高了工作效率. 2. 基础语法: 属性大于1个之后,属性之间用分号隔开 如果大于1个单词, ...

  5. HTML&CSS基础学习笔记1.23-表单的文本域和下拉列表

    文本域 <textarea>标签定义多行的文本输入控件. 平时在网页上的一些需要输入比较多的内容的输入框,比如回复帖子,回答问题等,都可以用<textarea>标签. < ...

  6. HTML&CSS基础学习笔记1.32-选择器是什么

    选择器是什么 选择器是CSS样式为了定位页面上的任意元素的一种方法. 选择器主要分为:元素标签选择器.通用选择器.类选择器.ID选择器.属性选择器.组合选择器.伪类选择器.伪元素选择器. 先做个了解, ...

  7. HTML&CSS基础学习笔记1.31-像素和相对长度

    像素和相对长度 之前的笔记中,我们提到过用属性width.height来设置图片的尺寸,它们的单元都是”px(像素)”.长度单位总结一下,目前比较常用到px(像素).em.% 百分比,要注意其实这三种 ...

  8. HTML&CSS基础学习笔记1.24-input标签的单选与多选

    单选和多选 单选框和多选框是用<input>标签来实现的. <input>标签的type属性值为"checkbox"时,表示多选框,为"radio ...

  9. HTML&CSS基础学习笔记1.5-添加常用标签

    代码如下: <!DOCTYPE html><html lang="en"><head>    <meta charset="UT ...

随机推荐

  1. 转：Qt项目中遇到的一些小问题汇总

    链接:http://blog.csdn.net/yangyunfeizj/article/details/7082001    作者:GoatYangYang 公司让负责qt界面开发,但是接触qt又不 ...

  2. JS版本网站资源状态检测

    Title:JS版本网站资源状态检测  --2012-08-28 14:08 前几天需要一个网站状态检测的东东,后面写了个蹩脚的JS版本,里面用到了以前没用过的东西,在这里记下来,其实批处理加curl ...

  3. 一句话输出NGINX日志访问IP前十位排行

    AWK的数组字段自增加,然后取值的方法,要记得哟. 还有,SORT指定列排行,也常用的.

  4. 使用SQLiteDatabase进行数据库操作的步骤

    1.获取SQLiteDatabase对象,它代表了与数据库的连接.2.调用SQLiteDatabase的方法来执行SQL语句.3.操作SQL语句的执行结果,比如用SimpleCursorAdapter ...

  5. 如何在tomcat启动的时候运行一个Java类

    设置个Listener就好了,在web.xml中指定描述. web.xml其实就是tomcat启动的时候会读取的一个描述文件,比如访问服务器的时候首页等都可以在里面指定,有相应的tag.这里有解释:h ...

  6. 【转】android:DDMS查看Threads--不错

    原文网址:http://www.cnblogs.com/mybkn/archive/2012/05/27/2520335.html 有时候程序运行出现死锁或者信号量卡死是很纠结的问题,单看代码很难分析 ...

  7. HDOJ 1058 Humble Numbers(打表过)

    Problem Description A number whose only prime factors are 2,3,5 or 7 is called a humble number. The ...

  8. DLL模块：extern "C"的简单解析

    1.揭密extern "C" extern "C"包含双重含义,从字面上即可得到:首先,被它修饰的目标是 "extern”的:其次,被它修饰的目标是 ...

  9. Groovy简洁开发，我用到的简洁之处

    最近一直在用Groovy开发以前的项目,一边学习一边开发,工具用的是IDEA(欲哭无泪,不熟悉真是搞死人).......由于我做的是服务层,是为公司其它项目做服务支撑的,所以就没有用框架,只有一些se ...

  10. 远程连接mysql,mysql如何开启远程连接

    很多时候,mysql只需要开本地连接,也就是本机(服务器本身)连接就可以,默认也是这样,默认也不支持远程连接 但有的时候,我们需要将mysql独立出一台主机或数据库,放到另一台机器的时候,这时,就需要 ...