HTML5简介

最新推荐文章于 2023-12-29 08:15:00 发布

而又何羡乎

最新推荐文章于 2023-12-29 08:15:00 发布

阅读量1.8k

点赞数

分类专栏： WEB前端学习文章标签： html

本文链接：https://blog.csdn.net/qq_44285092/article/details/108620526

版权

WEB前端学习专栏收录该内容

12 篇文章 4 订阅

订阅专栏

1 HTML5 简介

HTML是一种描述网页的语言，是一种标记语言，是制作网页的基础语言。

HTML的语法特点：

编写简单：无需任何编程经验。

标记数目有限
语法较弱：不一定需要对用的标记来结束，如就不一定需要来结束

HTML最基本的语法是<标记符></标记符>，通常是成对出现的，一个开始标记和一个结束标记。

2 HTML5 文档基本结构

HTML5文件的基本结构：一个完整的HTML5文件包括标题、段落、列表、表格、绘制的图形和各种嵌入对象，统称为HTML元素。其基本结构如下：

<!DOCTYPE html>
    <html> 文件开始的标记
        <head> 文档头部开始的标记
            <title>文件头的内容</title>
        </head>  文档头部结束的标记
        <body>  文件主体开始的标记
            文件主题的内容
        </body>  文件主体结束的标记
	</html> 文件结束的标记
</!doctype>

<body></body>  HTML的实际内容，显示在浏览器窗口的客户区。
如页面的文字、图像、超链接及其其它的HTML相关的内容定义在该标记中。

2.1 文档声明

<!DOCTYPE>是一个声明，不属于HTML标记
<!DOCTYPE html> 告知浏览器文档使用的是HTML规范，该标记位于HTML5中的首行

2.2 HTML5标记

说明文档使用HTML语言编写，目的是使浏览器能够正确的识别与显示
HTML5标记以<html>开头，以</html>结尾，文档所有的内容都写在里面。
在HTML5中，</html>可以省略，当时最好还是保留下来，更能符合Web标准和文档的完整性

2.3 头部标记

head是HTML的头部标记，头部信息不显示在网页中，可以保护一些其它标记。
用于说明文件标题和整个文件的一些公用属性。
包括了标题信息、元信息、定义CSS样式和脚本代码。
通过<style>标记定义CSS样式表，<script>标记定义javascript脚本文件。

2.3.1 标题标记

head中的重要组成部分，其内容显示在浏览器的窗口标题栏中,帮助用户更好的识别页面。若没有title标签，浏览器显示本页的文件名。页面的标题仅有一个。

2.3.2 元信息标记

提供有关页面的元信息，针对搜索引擎和更新频度的描述。位于head标签内部，定义了与文档关联的名称和值对。

属性	值	描述
chartset	character encoding	定义文档的字符编码
content	some_text	定义与http-equiv或name属性相关的元信息
http-equiv	content-type expires refresh set_cookie	把content属性关联到http头部
name	author description keywords generator revised other	把content关联到一个名称

字符集chartset属性：使字符集定义更加容易，常用的字符集如下表所示。

字符集代码	说明
utf-8	多语言(常用)
unicode	多语言
gb2312	简体中文
big5	繁体中文
iso-8859-1	西欧语系
iso-8859-2	中欧体系

<meta chartset="ISO-8859-1" />

搜索引擎的关键字：通过关键字可以检索到相关网页信息。

关键字在浏览时是看不到的，使用的格式如下：

<meta name="keywords" content="关键字1,关键字2" />

说明：
	不同关键字用英文","隔开
    注意是keywords
    关键字标签中的内容应该是一个个的短语，不是一段话

页面描述：简略描述网页的主要内容，即在搜索结果上展示给用户看的一段文字片段，使用格式如下

<meta name="description" content="网页介绍" />

页面定时跳转：使网页经过一定时间自动刷新，通过http-equiv属性值设置refresh来实现，content设置更新时间和跳转的网页等。

网页跳转：经过一定的时间，页面自动跳转到其它页面。
<meta http-equiv="refresh" content="秒;[url=网址]" />
   说明：url是可选项，有则定时刷新跳转，无则只刷新当前页面。

2.4 网页主体标记

> 网页所需要显示的内容都放置于网页的主体中，以<body>开始，以</body>结束。
> 需要注意的网页中所有代码都是不允许交错出现。

2.5 页面注释标记

注释是用来解释该代码或者提示其他信息，不会显示在浏览器中。代码格式为：

<!--这是一个注释-->

3 Web 标准

Web标准的最终目的是确保每一个人都有权访问到相同的信息，同时使网站开发变得更快捷，缩短开发和维护的时间，因此需要一定的标准来进行编码。Web标准不是某一个标准，而是一系列标准的集合，主要分为结构(Structure)、表现(Presentation)和行为(Behavior)。

3.1 结构化标准语言

XML：起初的目的是弥补HTML的不足，满足网络信息发展的需要，现用于网络数据的转换和描述
XHTML：实现HTML向XML的国度

3.2 表现标准语言

CSS是Cascading Style Sheets(层叠样式表的缩写)，其目的是以CSS取代HTML表格式布局、帧和其它语言。纯CSS布局与结构式XHTML相结合能够帮助设计师分离外观与结构，使站点的访问和维护更加容易。

3.3 行为标准

DOM：与平台、浏览器、语言无关的接口率，以此可以访问页面中的标准组件。解决了Netscaped的JavaScript与Microsoft的JavaScript之间的冲突，然后访问站点中的数据、脚本和表现层对象。
ECMAScript：ECMA指定的标准脚本语言(JavaScript)。

4 HTML5网页实例

<!DOCTYPE html>
<html>
	<head>
        <!--设置为utf-8字符集-->
        <meta chartset = "utf-8"/>
        <!--设置浏览器显示的标题-->
        <title>HTML5网页设计</title>    
    </head>
    
    <body>
        <!--白居易诗选-->
        <h1>续座右铭</h1>
        <p>
            千里始足下，<br>
            高山起微尘。<br>
            吾道亦如此，<br>
            行之贵日新。<br>
        </p>
    </body>
    
</html>

而又何羡乎

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
打赏
0
评论
HTML5简介

1 HTML5 简介HTML是一种描述网页的语言，是一种标记语言，是制作网页的基础语言。HTML的语法特点：编写简单：无需任何编程经验。标记数目有限语法较弱：不一定需要对用的标记来结束，如就不一定需要来结束HTML最基本的语法是<标记符></标记符>，通常是成对出现的，一个开始标记和一个结束标记。2 HTML5 文档基本结构HTML5文件的基本结构：一个完整的HTML5文件包括标题、段落、列表、表格、绘制的图形和各种嵌入对象，统称为HTML元素。
复制链接

扫一扫