链接

超级链接用<a>标签表示,href属性指定了链接到的地址。<a>标签可以包含文本,也可以包含图片。

点击查看效果

<a href="http://deerchao.net">deerchao的个人网站</a>
<a href="http://validator.w3.org"><img src="http://www.w3.org/Icons/valid-xhtml10" alt="验证HTML" /></a>

分段与换行

由于HTML文档会忽略空白符,所以要想保证正常的分段换行的话,必须指出哪些文字是属于同一段落的,这就用到了标签<p>。

<p>这是第一段。</p>
<p>这是第二段。</p>

也有人不用<p>,而用<br>。<br>只表示换行,不表示段落的开始或结束,所以通常没有结束标签。

点击查看效果

这是第一段。<br>
这是第二段。<br />
这是第三段。

有时,要把文档看作不同的部分组合起来的,比如一个典型的页面可能包括三个部分:页头,主体,页脚。<div>标签专门用于标明不同的部分:

<div>页头内容</div>
<div>主体内容</div>
<div>页脚内容</div>

表格

HTML文档在浏览器里通常是从左到右,从上到下地显示的,到了窗口右边就自动换行。为了实现分栏的效果,很多人使用表格(<table>)进行页面排版(虽然HTML里提供表格的本意不是为了排版)。

<table>标签里通常会包含几个<tr>标签,<tr>代表表格里的一行。<tr>标签又会包含<td>标签,每个<td>代表一个单元格。

点击查看效果

<table>
  <tr>
    <td>2000</td><td>悉尼</td>
  </tr>
  <tr>
    <td>2004</td><td>雅典</td>
  </tr>
  <tr>
    <td>2008</td><td>北京</td>
  </tr>
</table>

<tr>标签还可以被<table>里的<thead>或<tbody>或<tfoot>包含。它们分别代表表头,表正文,表脚。在打印网页的时候,如果表格很大,一页打印不完,<thead>和<tfoot>将在每一页出现。

<th>和<td>非常相似,也用在<tr>里边,不同的是<th>代表这个单元格是它所在的行或列的标题。

<table>
  <thead>
    <tr><th>时间</th><th>地点</th></tr>
  </thead>
  <tbody>
    <tr><td>2000</td><td>悉尼</td></tr>
    <tr><td>2004</td><td>雅典</td></tr>
    <tr><td>2000</td><td>北京</td></tr>
  </tbody>
</table>

快速掌握、学习HTML的方法的更多相关文章

  1. STM32环境搭建/学习观点/自学方法 入门必看

    文章转自armfly开发板V4软件开发手册,分享学习~ 今天有幸看到armfly的开发板软件开发手册,开头的基础知识,真的很有用,还好有看到,一切都不迟,感悟很多,摘抄部分,学习分享~ 关于开发环境的 ...

  2. 如何快速轻松学习bootstrap

    我以前也是通过看一些视频教程来学的,比如慕课网上的,比如51cto上的那些零基础入门bootstrap什么的,还有一些培训班里流传出来的,感觉晕乎乎的,不知所云. 还是在后面不断使用的过程中慢慢体会到 ...

  3. FWT快速沃尔什变换学习笔记

    FWT快速沃尔什变换学习笔记 1.FWT用来干啥啊 回忆一下多项式的卷积\(C_k=\sum_{i+j=k}A_i*B_j\) 我们可以用\(FFT\)来做. 甚至在一些特殊情况下,我们\(C_k=\ ...

  4. 【译】快速高效学习Java编程在线资源Top 20

    想要加强你的编程能力吗?想要提升你的 Java 编程技巧和效率吗? 不用担心.本文将会提供快速高效学习 Java 编程的 50 多个网站资源: 开始探索吧: 1.MKyong:许多开发者在这里可以找到 ...

  5. 快速高效学习Java编程在线资源Top 20(转载)

    想要加强你的编程能力吗?想要提升你的 Java 编程技巧和效率吗? 不用担心.本文将会提供快速高效学习 Java 编程的 50 多个网站资源: 开始探索吧: 1.MKyong:许多开发者在这里可以找到 ...

  6. Sass简单、快速上手_Sass快速入门学习笔记总结

    Sass是世界上最成熟.稳定和强大的专业级css扩展语言 ,除了Sass是css的一种预处理器语言,类似的语言还有Less,Stylus等. 这篇文章关于Sass快速入门学习笔记. 资源网站大全 ht ...

  7. SQL Server 2008 R2:快速清除日志文件的方法

    本例,快速清理“students”数据库的日志,清理后日志文件不足1M. USE [master] GO ALTER DATABASE students SET RECOVERY SIMPLE WIT ...

  8. linux几种快速清空文件内容的方法

    linux几种快速清空文件内容的方法 几种快速清空文件内容的方法: $ : > filename #其中的 : 是一个占位符, 不产生任何输出. $ > filename $ echo & ...

  9. SQL Server 2000:快速清除日志文件的方法

    通过文章 SQL Server中“数据收缩”详解 和 SQLServer删除log文件和清空日志的方法 可以整理出一种快速删除数据库日志的方法,即 第一步:清空日志文件里的数据: 第二步:收缩日志文件 ...

  10. 怎么学习AOPR使用方法

    Advanced Office Password Recovery作为一款专业级别的Office密码破解工具,对十几种office文档的密码都可以有效的破解.一些用户朋友才开始接触Advanced O ...

随机推荐

  1. Linux下Steam中支持中文的办法

    搜索过好几个解决方案,诸如添加skin等等,在我的ARCH机器上似乎都不行然后在搜索linux steam cjk时, 发现一个链接中有解决DOTA2显示中文不正确的问题,感觉可能有用,就参考着搞定了 ...

  2. Average Precision of VOC

    转一篇文章,主要是关于VOC中Average Precision指标的 原文出处:https://sanchom.wordpress.com/tag/average-precision/ 还有一篇文章 ...

  3. 在UP Board 上搭建M——L服务器

    前言 原创文章,转载引用务必注明链接,水平有限,欢迎指正. 本文环境:ubilinux 3.0 on UP Board 初识免流 所谓免流,就是免除手机访问网络产生的流量费用.其原理在乌云网上有过报道 ...

  4. android 一些常用开源框架

    网络请求compile 'com.squareup.okhttp:okhttp:2.6.0'okhttp依赖compile 'com.squareup.okio:okio:1.6.0'json解析co ...

  5. 关于JSP中<body onload="fun()">body标签中onload中函数不执行问题

    问题描述: 在一个页面中,我们经常会初始化一下数据,而且会在指定的DOM元素初始化数据,这时候我们就会使用<body onload="fun()">来加载我们的数据.o ...

  6. 显示oracle表的分区信息

    显示分区表信息 显示数据库所有分区表的信息:DBA_PART_TABLES 显示当前用户可访问的所有分区表信息:ALL_PART_TABLES 显示当前用户所有分区表的信息:USER_PART_TAB ...

  7. spring ioc 源码解析

    什么是ioc? 通俗的解释是:(spring)框架中,完成对象的创建和注入的容器. springIOC体系结构: spring IOC的创建是典型的工厂模式,这一系列的bean工厂如上所示. 其核心是 ...

  8. 第3月30天 UIImage imageWithContentsOfFile卡顿 Can't add self as subview MPMoviePlayerControlle rcrash

    1. UIImage imageWithContentsOfFile卡顿 [[UIImage alloc] initWithContentsOfFile 卡顿 2.uitableview scroll ...

  9. Django Restful Framework (一): Serializer

    Serializer 允许复杂数据(比如 querysets 和 model 实例)转换成python数据类型,然后可以更容易的转换成 json 或 xml 等.同时,Serializer也提供了反序 ...

  10. 页面解耦—— 统跳协议和Rewrite引擎

    原文: http://pingguohe.net/2015/11/24/Navigator-and-Rewrite.html 解耦神器 —— 统跳协议和Rewrite引擎 Nov 24, 2015 • ...