广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >html5有哪些作用
  • 190
分享到

html5有哪些作用

2024-04-02 19:04:59 190人浏览 八月长安
摘要

这篇文章给大家分享的是有关HTML5有哪些作用的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。html(Hypertext Markup Language,超文本标记语言)诞生于2

这篇文章给大家分享的是有关HTML5有哪些作用的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

html(Hypertext Markup Language,超文本标记语言)诞生于20世纪90年代初,用于指定构建网页的元素,这些元素中的大多数都用于描述网页内容,如标题、段落、列表、指向其他网页的链接等。HTML5是HTML的最新版本,它的大部分内容都可以兼容新旧浏览器,并新增了大量新的功能。HTML5还引入了原生的音频和视频播放功能。

通过下面的网址可以查看HTML的最新规范:

1)HTML5:Http://www.w3.org/TR/html5/

2)HTML5.1:http://www.w3.org/TR/html51/

HTML5简介

HTML5实际上是一系列用来制作现代富WEB内容的相关技术的总称,其中最重要的三项技术是HTML5核心规范、CSS(Cascading Style Sheets,层叠样式表)和javascript

 1)HTML5核心规范定义用以标记内容的元素,并明确其含义。

 2)CSS用于控制标记过的内容呈现在用户面前的外貌。

 3)JavaScript用来操纵HTML文档的内容以及响应用户的操作。

同时HTML5引入了原生的多媒体支持,并引入了可编程内容(canvas元素,必须用到JavaScript)和语义Web。

浏览器对HTML5的支持

浏览器功能验证

HTML5的功能能否使用,在于浏览器是否支持,现在有很多浏览器,每种浏览器还有许多版本,作为web开发人员,很难完全测试每种浏览器的某个版本是否支持某项功能。不过,有一个网站http://caniuse.com/可以帮助你,这个网站详细地列出了每一款主流浏览器对HTML5的支持情况。

浏览器的使用状况

如果你需要判断你是否需要支持某种浏览器,或者该浏览器的某个版本(通常是IE),那么http://gs.statcounter.com/可以帮助你,通过它你可以查看某个地区的浏览器使用状况。

检测浏览器功能

如果你想使用某些HTML5的新功能,但某些用户的浏览器不支持这些功能,也不用担心,你可以使用Modernizr,它是一个小巧的、持续更新的工具,专门用于测试浏览器对很多HTML5及相关功能的支持情况。

使用方法如下:

 到Modernizr的下载页面,如下:

html5有哪些作用

在这个页面上选择你想要探测的特征(点击对应特征旁的+),选择完毕后点击build,你就能得到:

html5有哪些作用

然后下载得到build的结果(modernizr-custom.js),并将其添加到你的html文档中;

<head>  
    <meta charset="utf-8">  
    <title>title</title>  
    <script src="modernizr-custom.js"></script>  
    ...  
</head>

 这样,在页面加载后,Modernizr脚本就可以运行了,它能在数毫秒时间内检测很多新功能,然后创建一个名叫Modernizr的JavaScript对象,检测结果就保存在这个对象中。通过检测这个对象的属性,就可以判断浏览器具体支持什么功能。例如:

<body>  
    <p>The verdict is ...<span id="result"></span></p>  
    <script>  
        Modernizr.on('flash', function( result ) {  
            if (result) {  
               document.getElementById("result").innerHTML = "Rejoice! Your brower has flash.";  
            }  
        });  
    </script>  
</body>

如果你的浏览器支持flash,网页上将会打印出“Rejoice! Your brower has flash.”。更多Modernizr的功能请参考Modernizr的文档。

HTML文档基本结构

”HTML文档就是对一个文档的描述,都有一个固定的结构,分为许多个部分,每个部分都包含了一个或者多个元素。有些元素用于描述文档的基本信息,有些则描述文档结构,下面就是一个基本的HTML文档的结构:

<!DOCTYPE html>  
<html lang="en">  
<head>  
    <meta charset="utf-8" />  
    <title>Your page title</title>  
</head>  
<body>  
  
  
</body>  
</html>

该HTML文档描述了一个空白页,这些基础成分确定了HTML文档的轮廓以及浏览器的初始环境。

DOCTYPE元素

DOCTYPE元素可以省略,大多数浏览器仍能正确显示文档内容,不过依赖浏览器的这种表现不是好习惯。该元素告诉浏览器两件事情:

1)它处理的是HTML文档;

2)用来标记文档内容的HTML所属的版本,上面的写法就表明所用的是HTML5。

html元素

html元素是根元素,它表明文档中HTML部分的开始。lang属性指定页面内容的默认语言,例如:en表示英语,es表示西班牙语,等。

head元素

head元素包含文档的元数据,向浏览器提供有关文档内容和标记的信息,还可以包含脚本和对外部资源(比如CSS样式表)的引用。

body元素

文档body部分包含访问者可以看到的内容。

在有了这个基本的结构后,我们后面就可以将HTML的其它元素逐步添加进去,不断的丰富文档,最终得到我们希望的页面。

感谢各位的阅读!关于“html5有哪些作用”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!

--结束END--

本文标题: html5有哪些作用

本文链接: https://www.lsjlt.com/news/78618.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • html5有哪些作用
    这篇文章给大家分享的是有关html5有哪些作用的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。HTML(Hypertext Markup Language,超文本标记语言)诞生于2...
    99+
    2022-10-19
  • html5动画制作软件有哪些
    HTML5动画制作软件有很多,以下是其中的几个:1. Adobe Animate:功能强大,可以创建交互式动画和游戏,支持多种输出格...
    99+
    2023-06-14
    html5动画制作 html5
  • html5的用法有哪些
    html5的用法有哪些,相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。html5可以做:1、新的图形库,用HTML5做游戏也是不错的选择;2、更...
    99+
    2022-10-19
  • 常用的HTML5网页制作软件有哪些
    这篇文章主要介绍了常用的HTML5网页制作软件有哪些的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇常用的HTML5网页制作软件有哪些文章都会有所收获,下面我们一起来看看吧。 ...
    99+
    2022-10-19
  • HTML5新标签有哪些及作用是什么
    今天小编给大家分享一下HTML5新标签有哪些及作用是什么的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来...
    99+
    2022-10-19
  • html5常用技巧有哪些
    小编给大家分享一下html5常用技巧有哪些,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧! 1. 新的...
    99+
    2022-10-19
  • HTML5常用语法有哪些
    这篇文章主要为大家展示了“HTML5常用语法有哪些”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“HTML5常用语法有哪些”这篇文章吧。HTML头部标记标记描述H...
    99+
    2022-10-19
  • html5有哪些应用场景
    今天小编给大家分享一下html5有哪些应用场景的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧...
    99+
    2022-10-19
  • HTML5适用范围有哪些
    这篇“HTML5适用范围有哪些”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“HTML5适用...
    99+
    2022-10-19
  • HTML5通用接口有哪些
    本篇内容介绍了“HTML5通用接口有哪些”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成! 1.先说几个基本...
    99+
    2022-10-19
  • HTML5事件有哪些
    本篇文章给大家分享的是有关HTML5事件有哪些,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。下面的表格列出了可插入 HTML 5 元素中以定义...
    99+
    2022-10-19
  • html5有哪些优点
    本篇内容介绍了“html5有哪些优点”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!html5是最近几年逐渐...
    99+
    2022-10-19
  • HTML5有哪些发展
    本篇内容主要讲解“HTML5有哪些发展”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“HTML5有哪些发展”吧!HTML5,被传为Flash 的杀手,是一种用于w...
    99+
    2022-10-19
  • html5定位有哪些
    html5定位有哪些,相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。html5定位有5种:1、绝对定位(absolute);2、相对定位(rel...
    99+
    2022-10-19
  • html5有哪些特点
    本篇内容主要讲解“html5有哪些特点”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“html5有哪些特点”吧! html5的特点:1...
    99+
    2022-10-19
  • html5中有哪些api
    这篇文章主要介绍了html5中有哪些api,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。 html5的api有:...
    99+
    2022-10-19
  • HTML5有哪些功能
    本篇内容主要讲解“HTML5有哪些功能”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“HTML5有哪些功能”吧!HTML5介绍2014年10月29日,万维网联盟正式宣布了 HTML5规范,HTML...
    99+
    2023-06-27
  • html5有哪些优势
    html5有哪些优势?针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。html有什么特点1、简易性:超级文本标记语言版本升级采用超集方式,从而更加灵活方便,适合初学前端开发者使...
    99+
    2023-06-14
  • 有哪些HTML5框架
    这篇文章给大家介绍有哪些HTML5框架,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。html5框架有:1、Siimpler,迅速简单地创建开发结构;2、Ionic,使用先进的Web技术;3、Foundation,兼容所...
    99+
    2023-06-15
  • HTML5中实用的API有哪些
    这篇文章主要为大家展示了“HTML5中实用的API有哪些”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“HTML5中实用的API有哪些”这篇文章吧。Element...
    99+
    2022-10-19
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作