HTML入门

什么是HTML
解析HTML
HTML标签
HTML元素
HTML版本
声明
- 通用声明
HTML编辑器
HTML基础
- HTML 标题
- HTML 段落
- HTML 链接
- HTML 图像

努力就能成功，坚持确保胜利。

什么是HTML

在我们的日常生活中经常会进入网站，看到https://baidu.com/xxx.html等的一些以html结尾的文件，那么html究竟是什么呢？

接下来我们进入正题，HTML是由Web的发明者 Tim Berners-Lee和同事 Daniel W. Connolly于1990年创立的，HTML的全称Hyper Text Markup Language中文意思为超文本标记语言，是一种标记语言它的扩展名为 .html或.htm。

HTML包括了一系列的标签。通过这些标签可以将Internet上一些零散的资源链接为一个逻辑整体。HTML文件是由HTML标签组成的描述性文本，HTML标签可以说明文字，图形、动画、声音、表格、链接等。

好了，我们现在已经大概了解到了什么是HTML，接下来我们该去了解HTML 的一些标签了。

解析HTML

上面是一个HTML文档的基本内容。

<!DOCTYPE html>：表示定义文档的类型，比如我定义的是HTML5
<html>：表示页面的根元素
<head>：表示头部它包含了网页的元数据
<title>：表示标题
<body> ：包含了可见的页面内容，只有body区域才会在页面中显示出来
<h1>：定义一个大标题
<div>：表示一个板块
<p>：表示了一个段落

tips：在网页内点击键盘的F12能开始开发者调试，可以看到HTML的组成标签。在edge浏览器中按Ctrl+u可以直接看到网页源码。

HTML标签

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。
HTML的标签是由尖括号和关键词组成的，例如<u>。HTML的标签一般都是成对的，例如开头标签<center>和结束标签</center>。

HTML元素

HTML标签和HTML元素都是差不多的意思，例如<p></p>就是HTML元素。

HTML版本

从网络的诞生之后，已经陆续的出现过很多的HTML版本。但我们目前使用最多的就是HTML5。
以下就是HTML各个版本和发布时间。

版本	发布时间
HTML	1991
HTML+	1993
HTML 2.0	1995
HTML 3.2	1997
HTML 4.01	1999
XHTML 1.0	2000
HTML5	2012
XHTML5	2013

<!DOCTYPE> 声明

<!DOCTYPE>声明有助于浏览器中正确显示网页。
网络上有许许多多不同的文件，只要能够正确的声明HTML的版本，浏览器就能够正确显示内容。

通用声明

HTML5：

<!DOCTYPE html>

HTML4.01：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

XHTML 1.0：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

注：声明是不区分大小写的，不论大写小写都能够正确执行。

HTML编辑器

在我们进行HTML代码编辑时，在电脑端我们可以使用专业的HTML开发工具比如VS Code、Sublime Text等，也可以使用我们电脑自带的记事本进行编辑，手机端推荐大家使用WebCat。

HTML基础

上面说了那么多废话，现在终于轮到了我们的正题。

HTML 标题

通常页面中的标题是通过<h1>~<h6>来实现的。

示例：

<h1>这是一个标题</h1>
<h2>这是一个标题</h2>
<h3>这是一个标题</h3>
<h4>这是一个标题</h4>
<h5>这是一个标题</h5>
<h6>这是一个标题</h6>

运行结果：

这是一个标题

HTML 段落

HTML的段落是由<p></p>实现的。

示例：

<p>这是一个段落。</p>
<p>这是另外一个段落。</p>

输出结果：

这是一个段落。这是另外一个段落。

HTML 链接

HTML的连接是由<a>标签实现的。

示例：

<a href="https://www.csdn.net/">这是一个链接</a>
<!-- href属性用来指定链接的地址-->

HTML 图像

HTML 图像是由标签实现的。

示例：

<img src="./yinian.png" width="50px" height="50px" />

输出结果：

学习的时光总是短暂的，轻轻一翻，文章就已经接近了尾声。
我们下节再见！

了解HTML标记语言相关推荐

安全性断言标记语言（SAML）介绍
简介安全是所有Web项目在设计时都要考虑的一个重要因素.无论是选择最短口令,决定何时使用SSL加密HTTP会话,还是通过自动登录cookie来识别用户,都经常要付出重大的设计努力,以保护用户的身份信 ...
“可扩展标记语言”(XML) 提供一种描述结构化数据的方法。
摘要: "可扩展标记语言"(XML) 提供一种描述结构化数据的方法.与主要用于控制数据的显示和外观的 HTML 标记不同,XML 标记用于定义数据本身的结构和数据类型. XML 使 ...
WPF第一章(XAML前台标记语言(Chapter02代码讲解))
XAML前台标记语言(Chapter2代码讲解) 很不好意思,工作有点忙,博客停了两天.相对于一门语言的学习,理论知识和实践必不可少,大多数时间我们要用,对于代码也是,一边不行可以看两遍,实在 ...
HTML超文本描述语言,HTML超文本标记语言的介绍
一.概念 1.定义超级文本标记语言是标准通用标记语言下的一个应用,也是一种规范,一种标准, 它通过标记符号来标记要显示的网页中的各个部分. 简而言之:一种为普通文件中某些字句加上标示的语言,其目的在 ...
可扩展标记语言--XML
XML(EXtensible Markup Language)可扩展标记语言,标准通用标记语言的子集,是一种用于标记电子文件使其具有结构性的标记语言. 在电子计算机中,标记指计算机所能理解的信息符号, ...
html语言设计表格,HTML标记语言——表格标记
HTML标记语言--表格标记互联网发布时间:2008-10-17 18:55:24 作者:佚名我要评论点击这里返回网页教学网 HTML教程栏目．上文:标记语言--标题原文出处 ...
使用MarkDown标记语言发博客
使用MarkDown标记语言发博客第一步:将博客园编辑器设置为Markdown 登录博客园,进入自己的博客首页,点击管理-〉选项,如下图所示. 在默认编辑器中选择Mardown,然后单击SAVE保存 ...
x_html语言名词解释,第2章++XHTML标记语言（97页）-原创力文档
第2章 XHTML标签语言 2.1 XHTML基础 2.2 段落和文字标签 2.3 列表标签 2.4 超级链接标签 2.5 插入图片标签 2.6 页面布局标签 2.7 框架标签 2.8 表单标签 2. ...
用html标记语言,HTML标记语言——引用
HTML标记语言--引用互联网发布时间:2008-10-17 18:55:18 作者:佚名我要评论点击这里返回网页教学网 HTML教程栏目．上文:标记语言--邪恶表格原文出处 ...
标记语言编程语言脚本语言分别有哪些？区别是什么？
一.各自的定义标记语言标记语言,是一种将文本(Text)以及文本相关的其他信息结合起来,展现出关于文档结构和数据处理细节的电脑文字编码.与文本相关的其他信息(包括例如文本的结构和表示信息等)与原来 ...

了解HTML标记语言

HTML入门

什么是HTML

解析HTML

HTML标签

HTML元素

HTML版本

<!DOCTYPE> 声明

通用声明

HTML编辑器

HTML基础

HTML 标题

这是一个标题

这是一个标题

这是一个标题

这是一个标题

这是一个标题

这是一个标题

HTML 段落

HTML 链接

HTML 图像

了解HTML标记语言相关推荐

最新文章

热门文章