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. C++之父给 C 程序员的建议

    1. 在 C++中几乎不需要用宏, 用 const 或 enum 定义显式的常量, 用 inline 避免函数调用的额外开销,用模板去刻画一族函数或类型,用 namespace 去避免命名冲突. 2. ...

  2. 编写python高质量python代码的59个有效方法

    第1条:确认自己的python版本 第2条:遵循PEP8的风格 1.空格 对于 占据多行的长表达式来说, 除了首行之外的其余各行都应该在通常的缩进级别上再加4个空格. 每行字符数不应该超过79. 2. ...

  3. CSV文件导入数据库和导出数据库

    实例一: <?php $filename = 'test'; //导出文件 header("Content-type: application/vnd.ms-excel; charse ...

  4. Linux驱动函数解读

    一.kmalloc().kzalloc()和vmalloc() 这三个函数都可以分配连续的虚拟内存 除此之外,这三个函数的区别有: 1. kmalloc()和kzalloc()函数分配的物理内存也是连 ...

  5. Nginx学习笔记(一):Nginx 进程模型 / 事件处理模型

    Nginx 进程模型 ​​​​ 多进程模型 进程间相互独立,无需加锁,且互不影响: 一个进程退出了不影响其他的进程运行,降低风险: 当请求到来,多个 worker 通过竞争 accrpt_mutex ...

  6. IMPDPORA-27046,dump文件损坏

    客户提出导入报错 一.报错如下 SYMPTOMS DataPump Import (IMPDP) fails with the following errors: ORA-: invalid oper ...

  7. linux时间同步ntpdate

    1.安装ntpdate,执行以下命令 yum install ntpdate -y 2.手工同步网络时间,执行以下命令,将从time.nist.gov同步时间 ntpdate 0.asia.pool. ...

  8. Abp SSO

    官方的文档有个坑. 首先建立的应该是 .net core  MPA版本. 把文档上的startup.cs配置写入 MVC 项目中. 这样测试才能通过.不然,测试项目     var disco = a ...

  9. 使用Java Executor框架实现多线程

    本文将涵盖两个主题: 通过实现Callable接口创建线程 在Java中使用Executor框架 实现Callable接口 为了创建一段可以在线程中运行的代码,我们创建了一个类,然后实现了Callab ...

  10. Apache ---- Solrl漏洞复现

    Solr是一个独立的企业级搜索应用服务器,它对外提供类似于Web-service的API接口.用户可以通过http请求,向搜索引擎服务器提交一定格式的XML文件,生成索引:也可以通过Http Get操 ...