软件测试 / 测试开发|一篇文章带你入门 HTML
前言
上一篇文章我们提到了 web 的三大主要资源,HTML,CSS 以及 JS,HTML 是提供 web 页面内容的资源,本文我们就来介绍一下 HTML。
HTML
HTML(HyperText Markup Language)是 web 的核心组成部分之一,是构建网页的基础语言。HTML 使用标记来描述文档的结构,并定义了网页上的内容,包括文本、图像、链接等。
HTML 是一种在 Web 上使用的通用标记语言。HTML 允许你格式化文本,添加图片,创建链接、输入表单、框架和表格等等,并可将之存为文本文件,浏览器即可读取和显示。
HTML 指的是超文本标记语言: HyperText Markup Language
HTML 不是一种编程语言,而是一种标记语言
标记语言是一套标记标签 (markup tag)
HTML 使用标记标签来描述网页
HTML 文档包含了 HTML 标签及文本内容
HTML 文档也叫做 web 页面
示例
我们可以直接通过示例来介绍 HTML 的基本使用,首先,我们新建一个 html 文件,命名可以随意,但是后缀必须为.html
,比如叫study.html
。
其中:
<!DOCTYPE html>
声明为 HTML5 文档<html>
元素是 HTML 页面的根元素<head>
元素包含了文档的元(meta)数据,如<meta charset="utf-8">
定义网页编码格式为utf-8
(由于在大部分浏览器中直接输出中文会出现乱码,所以要在头部将字符声明为 UTF-8)<title>
元素描述了文档的标题<body>
元素包含了可见的页面内容<h1>
元素定义一个大标题<p>
元素定义一个段落
我们可以在浏览器中打开这个 HTML 文件,界面如下图:
HTML 各标签详解
标题
HTML 标题(Heading)是通过<h1> - <h6>
标签来定义的,示例如下:
段落
HTML 段落是通过标签 <p>
来定义的,示例如下:
链接
HTML 链接是通过标签 <a>
来定义的,示例如下:
图像
HTML 图像是通过标签 <img>
来定义的。注意: 图像的名称和尺寸是以属性的形式提供的。示例如下:
表格
表格由 <table>
标签来定义。每个表格均有若干行(由 <tr>
标签定义),每行被分割为若干单元格(由 <td>
标签定义)。字母 td 指表格数据(table data),即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。表格的表头使用 <th>
标签进行定义。如果不定义边框属性,表格将不显示边框。有时这很有用,但是大多数时候,我们希望显示边框。使用边框属性来显示一个带有边框的表格:
总结
HTML 作为构建网页的基础语言,为互联网世界的发展奠定了坚实的基础。通过不断地学习和了解 HTML 的新特性,我们能够创造出更加丰富、功能更强大的网页体验。本文主要介绍了 HTML 的基础知识,各种内容如何在 HTML 上体现,希望本文能够帮到大家!
评论