html基础教程之HTML 简介

HTML基础教程(一)HTML 简介:Web世界的基石,深度解析HTML及其在现代开发中的核心作用 HTML(超文本标记语言)是互联网的基石,定义了网页内容的结构和含义。本文深度分析HTML的基本概念、发展历程及核心功能,通过具体示例展示其语法特点与语义化价值。文章探讨HTML如何与其他Web技术协同工作,以及HTML5带来的革命性变化,为初学者和从业者提供全面而深入的理解视角。 阅读详情

HTML 简介

HTML 实例

<!DOCTYPE html>
<html>
<body>

 

<h1>我的第一个标题</h1>

<p>我的第一个段落。</p>

</body>
</html>

实例解析

  • DOCTYPE 声明了文档类型
  • 位于标签 <html> 与 </html> 描述了文档类型
  • 位于标签 <body> 与 </body> 为可视化网页内容
  • 位于标签 <h1> 与 </h1> 作为一个标题使用
  • 位于标签 <p> 与 </p> 作为一个段落显示
lamp<!DOCTYPE html> 在HTML5中也是描述了文档类型。

 


什么是HTML?

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

  • HTML 指的是超文本标记语言: Hyper Text 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页面结构:

<html>

 

<head>

 

<title>页面标题</title>

</head>

<body>

 

<h1>这是一个标题</h1>

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

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

</body>

</html>

 

Note只有 <body> 区域 (白色部分) 才会在浏览器中显示。

 


HTML版本

从初期的网络诞生后,已经出现了许多HTML版本:

版本发布时间
HTML1991
HTML+1993
HTML 2.01995
HTML 3.21997
HTML 4.011999
XHTML 1.02000
HTML52012
XHTML52013

 


<!DOCTYPE> 声明

<!DOCTYPE>声明有助于浏览器中正确显示网页。

网络上有很多不同的文件,如果能够正确声明HTML的版本,浏览器就能正确显示网页内容。

doctype 声明是不区分大小写的,以下方式均可:

<!DOCTYPE html>

 

<!DOCTYPE HTML>

<!doctype html>

<!Doctype Html>


通用声明

HTML5

<!DOCTYPE html>

HTML 4.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”>


中文编码

目前在大部分浏览器中,直接输出中文会出现中文乱码的情况,这时候我们就需要在头部将字符声明为 UTF-8。

HTML 实例

<!DOCTYPE html>
<html>
<head>
<meta charset=”UTF-8″>
<title>页面标题</title>
</head>
<body>

 

<h1>我的第一个标题</h1>

<p>我的第一个段落。</p>

</body>
</html>

更多精彩内容学习 点我学

HTML5基础教程(一)简介:别了,Flash!HTML5:互联网世界的乐高大师与全能戏精 HTML5绝非简单标记语言的版本更新,而是一场重塑Web世界的底层革命。它甩掉了对插件的依赖,自带“影音芯片”,让视频音频原生嵌入;它手持“万能画笔”Canvas,开创了网页游戏与数据可视化的新纪元;它更是“语义化乐高大师”,用Header、Nav等标签为内容和SEO搭建清晰结构。其跨平台基因是移动时代的基石,让“一次开发,处处可用”成为可能。HTML5不仅是技术规范,更是构建现代、开放、互联且充满想象力的数字体验的核心引擎。 阅读详情

相关推荐

html教程(完整版)

最新,最完整的HTML教程,包括html指令, 最新,最完整的HTML教程,包括html指令,

HTML详细教程

HTML 是网页使用的语言,定义了网页的结构和内容。浏览器访问网站,其实就是从服务器下载 HTML 代码,然后渲染出网页。HTML 的全名是超文本标记语言(HyperText Markup Language),上个世纪 90 年代由欧洲核子研究中心的物理学家蒂姆·伯纳斯-李(Tim Berners-Lee)发明。它的最大特点就是支持超链接,可以跳转到其他网页,从而构成了整个互联网。1999 年,HTML 4.0.1 发布,成为广泛接受的 HTML 标准。

qq_40046544的博客 2万+

HTML教程资源

一份关于HTML学习的资源文档,适合初学者使用。是一些入门的基础知识。

HTML入门教程【2024】

网页是构成网站的基本元素,它通常由图片,链接,文字,声音,视频等元素组成。通常我们看到的网页,常见以.htm或.html后缀结尾的文件,因此我们把它俗称为HTML文件。

m0_74114518的博客 1551

HTML5完整教程

该文档为HTML5开发教程,适合零基础学习或感兴趣者进行深入研究

IAP板卡远程升级(串口网口都可)+Ymodem+AES对bin文件加密+pc软件+板卡相互烧录

还是决定记录一下,毕竟这个东西我也搞了挺久的,遇到一些棘手的,或者是因为我很粗心遇到的问题也和大家分享一下,。 板卡核心是 STM32F103RCT6,256kflash 前言 开始看这个远程升级的时候,我是一头雾水的,原子哥的教程里面也有说到过iap,有了一个大概的了解,我想不明白的是,通过串口下载的方式把hex文件下载到flash,和把bin文件下载到flash难道不是拉一根线,下载一个文件嘛,(初入职场的我并没有考虑到安全这个问题)如果直接将hex文件给到客户那边,风险是非常大...

那可真是太开心了的博客 5371

【前端必备】1.HTML零基础入门教程(详细)

HTML 指的是超文本标记语言: HyperText Markup LanguageHTML 不是一种编程语言,而是一种标记语言。

金哥的博客 2781

模拟滤波器的基础知识和设计

使用Python实现多种模拟滤波器

faltas的博客 3530

HTML零基础入门教程(详细)

HTML 是用来描述网页的一种语言。HTML 是一种在 Web 上使用的通用标记语言。HTML 允许你格式化文本,添加图片,创建链接、输入表单、框架和表格等等,并可将之存为文本文件,浏览器即可读取和显示。 HTML 指的是超文本标记语言:HyperTextMarkupL...

ZONGXP的博客 27万+

使用静态库在嵌入式系统中进行开发

静态库是一种包含预编译对象代码的文件,它可以与应用程序链接在一起,并在编译时将库的代码复制到最终的可执行文件中。静态库是包含预编译对象代码的文件,可以与应用程序链接在一起,并在编译时将库的代码复制到最终的可执行文件中。需要注意的是,由于嵌入式系统的资源限制,开发人员应该仔细选择需要包含在静态库中的功能,并避免引入不必要的依赖关系。需要注意的是,由于嵌入式系统的资源限制,开发人员应该仔细选择需要包含在静态库中的功能,并避免引入不必要的依赖关系。的静态库文件,可以在嵌入式系统的应用程序中使用它了。

ZrElixir的博客 205

RH850从0搭建Autosar开发环境【1】- 如何创建Davinci Configurator配置工程

当我们在公司接触Autosar开发环境时,基本都是完整的Davinci Configurator的配置工程,我们只能修修补补。 从本章开始将手把手搭建Rh850基于Vector公司Davinci Configurator的autosar配置工程。主要涉及到OS,COM,DCMM,NVM,BSWM,ECUM等基本模块,包括Vlink,memap使用,XCP标定的实现等。基本是实现一个基础版的项目开发。包括后期的GreenHills编译问题处理,生成最终的Hex文件。

weixin_42412049的博客 1万+

html+css基础教程之html简介和元素

HTML 简介 什么是 HTML? HTML即超文本标记语言 (Hyper Text Markup Language), 是用来描述网页的一种语言。 超文本标记语言的结构包括"头"部分(外语:Head)、和"主体"部分(外语:Body),其中"头"部提供关于网页的信息,"主体"部分提供网页的具体内容。 标记语言是一套标记标签 (markup tag) HTML 使用标记标签来描述网页 如下代...

html前端基础入门教程 3834

西门子SMART PLC增量式PID(完整梯形图FC)

西门子PLC自带的PID指令是基于位置型的PID,位置型PID的算法公式和详细介绍,大家可以参看《PID专栏》的其它文章,这里不再赘述。本篇博文直接给出代码部分的讲解,不设计太多公式和理论的推导。限于本人能力,文中难免出现错误和不足之处,诚恳欢迎大家的批评和指正。同时感谢大家的订阅和关注。SMART200 PLC系统自带的PID指令解析,可以参看下面这篇文章:SMART PLC PID算法基本解析(附公式)_RXXW_Dor的博客-优快云博客_plc的pid算法在态运行中,控制器调节输出值,使偏差 (e

RXXW_Dor的博客 8149

【HTML 基础教程】HTML 简介

HTML 是用来描述网页的一种语言。HTML 指的是超文本标记语言 (HyperTextMarkupLanguage)HTML 不是一种编程语言,而是一种标记语言标记语言是一套标记标签HTML 使用标记标签来描述网页。

书成日记,日记便成了一本书 264

安装keil软件时安装不了芯片包怎么回事?芯片包安装路径放在Keill里的packs下面,弹框提示报错:Errors retumned from cpackget...如何解决?

🏆本文收录于 《全栈 Bug 调优(实战版)》 专栏。专栏聚焦真实项目中的各类疑难 Bug,从成因剖析 → 排查路径 → 解决方案 → 预防优化全链路拆解,形成一套可复用、可沉淀的实战知识体系。无论你是初入职场的开发者,还是负责复杂项目的资深工程师,都可以在这里构建一套属于自己的「问题诊断与性能调优」方法论,助你稳步进阶、放大技术价值 。

**My Coding Family** 2207

【Bug已解决】zsh: command not found: claude 解决方案

方案适用场景推荐指数难度方案一:配置 npm 全局目录所有平台,长期使用⭐⭐⭐⭐⭐低方案二:修复 PATH 变量快速修复,不想改 npm 配置⭐⭐⭐⭐低方案三:重建软链接文件存在但链接断裂⭐⭐⭐中方案四:nvm 专属方案使用 nvm 管理多版本 Node.js⭐⭐⭐⭐低方案五:Windows 专属Windows 系统⭐⭐⭐⭐⭐低方案六:Homebrew 安装macOS 用户,npm 有问题⭐⭐⭐低根本原因。

博客 1万+

HTML基础教程简介

HTML基础教程之简介 HTML,Hypertext Markup Language ,超文本标注语言。 HTML是一种规范,是一种标准,编写网页的一种标准。 超文本:就是网页上不光有文本,还有图片、音乐、视频等。 标注:是一种记号,是一种标志。如:红绿灯 语言:这里的“语言”就是代码,跟所谓“程序语言”一点关系都没有。 HTML的主要目的:就是用来显示网页的不同效果、不同部分。如:文本 来看看我们学习HTML的第一个例子: 这是我们的第一个页面

xiaoyeboke的博客 172

Outlook Express 6 (OE6) for Win7/Win8/Win10

英文版 Outlook Express6.0, 兼容Win7/Win10/WinXP,解压就可用。

HTML5 简介及基础教程

学习 HTML 新手教程是入门前端开发的基础。对于想要深入学习前端开发的人来说,需要继续学习和掌握其他相关技术和工具。

Glenseeds的博客 1324

假人有限元模型

假人模型,车辆碰撞假人有限元模型,适合做乘员安全的研究者利用

Camera2Demo

在Camera2 的基础上进行封装,使得Camera2一堆初始化逻辑与Activity分离,降低耦合度,完成预览拍照并保存的操作

【 HTML 基础教程(简介)】

本文介绍了HTML的基础知识,主要内容包括: HTML定义:超文本标记语言,用于描述网页结构和内容,通过标签标记各种网页元素。 标签特性:分为双标签(如<b></b>)和单标签(如<br/>),以及块级元素(换行显示)和内联元素(不换行)。 文档结构:包含<!DOCTYPE>声明指定HTML版本,基本骨架由<html>、<head>和<body>组成。 语义化:推荐使用有明确含义的标签(如<h1>、<p>),便于搜索引擎和浏览器解析。

Hey_Coder 1795

HTML基础教程(1)-HTML简介

欢迎来到HTML的世界,现在开始HTML之旅吧! HTML是什么 HTML是一种超文本标记语言,你可以用它来构建你的网页,我们也经常会吧HTML和CSS,JavaScript来一起使用,这里有一个生动的比喻: 假设把网页比作人体,那么HTML定义了人的骨架,CSS决定了人要长什么样,JavaScript定义了人的行为。 现在知道HTML是干什么的了吧! HTML基础 注意:HTML不是一种编程...

pynickle的博客 266

HTML基础教程学习笔记——W3School

HTML 标签通常是成对出现的,比如 <b> 和 </b>标签对中的第一个标签是开始标签,第二个标签是结束标签<html><body><h1>我的第一个标题</h1><p>我的第一个段落。</p></body></html><html> 与

D20040113的博客 889

HTML简介(内容整理来自黑马程序员pink老师前端基础教程)

一、网页 进行网页开发,那么首先有如下的三个问题? 1. 什么是网页? 2. 什么是HTML? 3. 网页的形成? 1.1什么是网页? 网站是指在因特网上根据一定的规则,使用 HTML 等制作的用于展示特定内容相关的网页集合。 网页是网站中的一“页”,通常是 HTML 格式的文件,它要通过浏览器来阅读。 网页是构成网站的基本元素,它通常由图片、链接、文字、声音、视频等元素组成。通常我们看到的网页, 常见以 .htm 或 .html 后缀结尾的文件,因此将其俗称为 HTML 文件。 1.2

m0_56298447的博客 308

Cesium基础教程-HTMLOverlay-简介

我们知道Cesium是基于WebGL进行渲染的,所以场景中所有的三维地理对象都是绘制在canvas上的,但是为了增强三维场景的可视化效果,我们往往需要使用HTML+CSS来制作一些精美的覆盖物,比如信息框、文本标签等,我们统称为 HTMLOverlay。作为单纯的DOM元素,虽然无法做到像场景中的三维地理对象那样与场景真正融为一体,但是我们可以为其绑定一个真实的地理坐标,使其看起来就像是场景中的对象一样。Cesium官网示例中提供了一个基本的HTMLOverlay 示例。

xt3d的博客 666

HTML基础教程 - 从零基础入门到精通

HTML(HyperText Markup Language)即超文本标记语言,是用于创建网页的标准标记语言。需要注意的是HTML并不是编程语言, 而是一种标记语言。 DOCTYPE声明html根元素head头部body主体meta元数据title标题h1标题p段落 2.2 文档类型声明 2.3 head标签详解 3. HTML常用标签 3.1 文本标签 标题标签 3.2 列表标签 #mermaid-svg-NslTTOlYmzmb67jh {font-family:"trebuchet ms",v

askein的博客 497

JavaScript基础教程(六十一)HTML DOM简介:指尖上的交响乐,深度解析JavaScript HTML DOM

HTML DOM是网页的结构化编程接口,允许JavaScript动态访问和操作HTML文档。它将文档解析为节点树,开发者可通过修改节点属性、样式、内容实现交互效果。本文深入剖析DOM核心概念,包括节点类型、访问方法、事件处理机制,并通过实际示例演示如何高效操作DOM元素,同时提供性能优化建议,助你掌握前端开发的核心技术。

jxf_jxfcsdn的博客 266
上一篇: html基础教程之html教程
下一篇: html基础教程之HTML 编辑器
html基础教程
博客等级 码龄7年 136粉丝 108原创
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值