HTML简介

超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。

您可以使用 HTML 来建立自己的 WEB 站点，HTML 运行在浏览器上，由浏览器来解析。

HTML 是用来描述网页的一种语言。

  • HTML 指的是超文本标记语言: HyperText Markup Language
  • HTML 不是一种编程语言，而是一种标记语言
  • 标记语言是一套标记标签 (markup tag)
  • HTML 使用标记标签来描述网页
  • HTML 文档包含了HTML 标签及文本内容
  • HTML文档也叫做 web 页面

HTML标签

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

  • HTML 标签是由尖括号包围的关键词，比如 <html>
  • HTML 标签通常是成对出现的，比如 <b> 和 </b>
  • 标签对中的第一个标签是开始标签，第二个标签是结束标签
  • 开始和结束标签也被称为开放标签和闭合标签
<标签>内容</标签>

HTML元素

"HTML 标签" 和 "HTML 元素" 通常都是描述同样的意思.

但是严格来讲, 一个 HTML 元素包含了开始标签与结束标签，如下实例:

HTML 元素:

<p>这是一个段落</p>

Web浏览器

Web浏览器（如谷歌浏览器，Internet Explorer，Firefox，Safari）是用于读取HTML文件，并将其作为网页显示。

浏览器并不是直接显示的HTML标签，但可以使用标签来决定如何展现HTML页面的内容给用户。

HTML网页结构

下面是一个可视化的HTML页面结构。

注意：只有body区域的内容才会显示在浏览器中。

HTML编译器

我采用EditPlus文本编译器来用作HTML的编程工具，因为其提供了可供选择的项目类型，会自动生成一些配置，用起来比较方便，如下图。

注意：对于中文网页需要使用 <meta charset="utf-8"> 声明编码，否则会出现乱码。有些浏览器(如 360 浏览器)会设置 GBK 为默认编码，则你需要设置为 <meta charset="gbk">

HTML后缀名

HTML的后缀名有两种

  • .html
  • .htm

以上两种后缀名没有区别，都可以使用。建议使用.html。

HTML实例

创建第一个HTML网页，再EditPlus中新建一个HTML项目，编辑如下内容：

<!doctype html>

<html lang="en">

 <head>

  <meta charset="UTF-8">

  <meta name="Generator" content="EditPlus®">

  <meta name="Author" content="">

  <meta name="Keywords" content="">

  <meta name="Description" content="">

  <title>Document</title>

 </head>

 <body>

    <h1>This is my first page!</h1>

    <h2>This is test page too!</h2>

    <p>这是我的第一个段落！</p>

 </body>

</html>

Ctrl+B 查看运行效果如下：

作者：Jeremy.Wu
  出处：https://www.cnblogs.com/jeremywucnblog/

  本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。

HTML - My First Page!的更多相关文章

  1. 我这么玩Web Api（一）：帮助页面或用户手册(Microsoft and Swashbuckle Help Page)

    前言 你需要为客户编写Api调用手册?你需要测试你的Api接口?你需要和前端进行接口对接?那么这篇文章应该可以帮到你.本文将介绍创建Web Api 帮助文档页面的两种方式,Microsoft Help ...

  2. HTML5 Page Visibility

    什么是 Page Visibility ? Page Visibility 即页面可见性,通过 visibilityState 的值检测页面当前是否可见.当一个网站是可见或点击选中的状态时 Page ...

  3. angularjs 1 开发简单案例(包含common.js,service.js,controller.js,page)

    common.js var app = angular.module('app', ['ngFileUpload']) .factory('SV_Common', function ($http) { ...

  4. Selenium的PO模式（Page Object Model）[python版]

     Page Object Model 简称POM  普通的测试用例代码: .... #测试用例 def test_login_mail(self): driver = self.driver driv ...

  5. SharePoint2013 Set a custom application page as site welcome page

    本文主要介绍如何添加一个custom application page as site welcome page 1.首先创建一个sharepoint 2013 empty solution, add ...

  6. 使用page object模式抓取几个主要城市的pm2.5并从小到大排序后写入txt文档

    #coding=utf-8from time import sleepimport unittestfrom selenium import webdriverfrom selenium.webdri ...

  7. github page+jekyll搭博客初体验

    div.oembedall-githubrepos { border: 1px solid #DDD; list-style-type: none; margin: 0 0 10px; padding ...

  8. selenium page object & Page Factory

    package demo; import java.util.concurrent.TimeUnit; import org.openqa.selenium.By; import org.openqa ...

  9. <%@ page trimDirectiveWhitespaces="true" %>

    我们经常会在JSP页面上使用: <%@ page trimDirectiveWhitespaces="true" %> 这个命令可以使jsp输出的html时去除多余的空 ...

  10. MIT 6.828 JOS学习笔记18. Lab 3.2 Part B: Page Faults, Breakpoints Exceptions, and System Calls

    现在你的操作系统内核已经具备一定的异常处理能力了,在这部分实验中,我们将会进一步完善它,使它能够处理不同类型的中断/异常. Handling Page Fault 缺页中断是一个非常重要的中断,因为我 ...

随机推荐

  1. PAT甲级 排序题_C++题解

    排序题 PAT (Advanced Level) Practice 排序题 目录 <算法笔记> 6.9.6 sort()用法 <算法笔记> 4.1 排序题步骤 1012 The ...

  2. 开启 oracle 的闪回功能

    查看是否开启闪回 SQL> select flashback_on from v$database; FLASHBACK_ON ------------------ NO 查看是否配置了db_r ...

  3. STM32之ADC实例（基于DMA方式）

    版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/zouleideboke/article/details/75112224 ADC简介: ADC(An ...

  4. java 字符串处理的

    @Test public void testString(){ /*字符串处理 */ String email="123456789@qq.com"; System.out.pri ...

  5. Linux自动运维工具Ansible的使用

    Linux自动运维工具Ansible的使用 我们熟悉这个工具后, 可以很轻松的安装k8s. 一.介绍 ansible - run a task on a target host(s) Ansible是 ...

  6. win10 右键新建卡顿

    前段时间不知道自己搞啥了,右键变得很慢,找了一些常规的解决方案,什么清除注册表等等的,对我来说,没好用. 然后将就继续使用,然后觉得是office的问题,卸载,重装2010的,发现还是一样卡... 继 ...

  7. 利用jwt生成token，用于http请求身份验证

    前段时间在做移动端接口过程中,考虑到安全性,所有移动端发送请求(除了登录请求)过程中进行token有效验证. 1.利用jwt生成token a.导入jwt相关包 <!-- jwt --> ...

  8. map自定义键值类型

    map自定义键值类型 改变Map的默认比较方式 https://www.cnblogs.com/zjfdlut/archive/2011/08/12/2135698.html 大家知道,STL中的ma ...

  9. 踩坑记录-连接 MongoDB Compass Community 报错

    在控制台输入 mongod 启动 mongodb服务,地址栏输入http://localhost:27017/ 能看到下图,表示服务启动成功. 打开"MongoDB Compass Comm ...

  10. GNU，GPL与自由软件

    GNU 是 Richard Stallman(理查德·斯托曼)创建的一个项目,not unix GPL(General Public License),GNU通用公共许可证.书面上的协议 自由软件与开 ...