1.简单认识H5

HTML5不仅仅是作为HTML标记语言的一个最新版本,更重要的是它指定了Web开发的一系列标准,成为第一个将Web作为应用开发平台的HTML语言.

我们日常讨论的H5其实是有一个泛称,他指的是有HTML5 + CSS3 + Javascript等技术组合而成的一个应用开发平台.

2.语义化

所谓语义化是要使HTML标签具备很好的可读性,可以很清晰传达每个标签所要表达的意义,一方便其被友好的处理和解析.

3.语义化标签

对于语义化标签我们并不陌生,在此基础上HTML5增加 了更多的语义化的标签,有利于搜索引擎或辅助设备来理解HTML页面内容.

新的语义标签与<div>,<span>没有差别,知识其具有语义性,使用时除了在HTML结构上需要注意外,其他和普通标签的实用无任何差别,可以理解成<div class="nav">相当于nav

4.兼容处理

在不支持HTML5新语义的标签的浏览器里,会将这些新的标签解析成行内元素(inline)对待,所以我们需要将其转换为块级元素(block)即可,但是在IE9版本一下,并不能正常解析这些新标签,但是却可以是被通过document.creatElement('tarName')创建的自定义标签,于是我们的解决方案就是讲HTML5 的标签全部通过document.creatElement('tagname')来创建一遍,这样IE低版本也能正常解析HTML5了.

但在实际中,我们是通过检测ie浏览器的版本来和加载第三方的一个js库开解决兼容问题 的.

5.表单

HTML5中WEB表单方面有很大的改进,如拾色器,日期/时间组件等.使表单处理变的更高效

6.多媒体

在HTML5之前,在网页上播放音频/视频的通用方法时候利用flash实现的,但是大多情况下,并非所有用户的浏览器都安装了Flash插件,由此使得处理音频/视频播放变的非常复杂,并且移动设备的浏览器并不支持flash插件.

音频

HTML5通过<audio>标签来解决音频播放的问题

由于版本等原因,不同 的浏览器可支持播放的格式是不一样 的,通过audio指定多种音频格式兼容更多的浏览器

<audio>
<source src="">
<source src="">
<audio>
 视频
HTML5通过<video>标签来解决音频播放的问题

由于版本等原因,不同 的浏览器可支持播放的格式是不一样 的,通过audio指定多种音频格式兼容更多的浏览器

<video>
<sourse src="">
<sourse src="">
<video>

  

H5简单内容的更多相关文章

  1. 使用 CGContextRef 进行简单内容绘制

    摘要 : CGContextRef 功能强大,我们借助它可以画各种图形.这里所举例子只是简单内容绘制,冰山一角,对此感兴趣的朋友可以举一反三,实现各种酷炫效果. 效果如下: KMDrawView.h ...

  2. H5小内容(四)

    SVG   基本内容     SVG并不属于HTML5专有内容       HTML5提供有关SVG原生的内容     在HTML5出现之前,就有SVG内容     SVG,简单来说就是矢量图     ...

  3. H5小内容(三)

    Canvas(画布)   基本内容     简单来说,HTML5提供的新元素<canvas>     Canvas在HTML页面提供画布的功能       在画布中绘制各种图形     C ...

  4. H5小内容(一)

    HTML5目前最新的规范(标准)是2014年10月推出   2005年左右出现HTML5版本(非标准)     W3C组织(两个组织定义H5规范)   学习(研究)HTML5是学习未来(将来主流)   ...

  5. 基于Tags的简单内容推荐的实现

    原来为了简单方便,自己小网站上的文章页的相关内容推荐就是从数据库里随机抽取数据来填充一个列表,所以一点相关性都没有,更本没有办法引导用户去访问推荐内容. 算法选择 如何能做到相似内容的推荐呢,碍于小网 ...

  6. h5基本内容

    一 简介 html 超文本标记语言 W3C 中立技术标准机构 W3C标准包括 结构化标准语言(HTML,XML) 表现标准语言(CSS) 行为标准(DOM,ECMAScript) 二 入门例子 < ...

  7. H5小内容(六)

    Web Worker   基本内容     单线程与多线程       Worker可以模拟多线程的效果     定义 - 运行在后台的javascript     注意 - 不能使用DOM      ...

  8. H5小内容(五)

    Geolocation(地理定位)   基本内容     地理定位 - 地球的经度和纬度的相交点     实现地理定位的方式       GPS - 美国的,依靠卫星定位       北斗定位 - 纯 ...

  9. H5小内容(二)

    音视频处理   视频处理     基本内容       使用Flash技术处理HTML页面中的视频内容         包含音频.动画.网页游戏等  特点    浏览器原生不支持(IE浏览器要求安装A ...

随机推荐

  1. day25:魔术方法

    目录 1.__del__(析构方法) 2.魔术方法:__str__ 3.魔术方法:__repr__ 4.魔术方法:__call__ 5.魔术方法:__bool__ 6.魔术方法:__add__& ...

  2. [机器学习] keras:MNIST手写数字体识别(DeepLearning 的 HelloWord程序)

    深度学习界的Hello Word程序:MNIST手写数字体识别 learn from(仍然是李宏毅老师<机器学习>课程):http://speech.ee.ntu.edu.tw/~tlka ...

  3. Django中manage.py migrate无效的问题

    在改变Django-model中结构后,makemigrations可以识别到改变但migrate没有操作,数据库中表结构也没有改变,原因如下: 在由Django-model自动生成的数据库表中有名为 ...

  4. C#经典算法实践,回顾往生,更是致敬《算法导论》

    该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/666 访问. 概述 本系列博文将会向大家介绍本人在钻研<算法导论 ...

  5. Flask实现RESTful API(注意参数位置解析)

    准备工作 首先安装flask_restful三方组件 pip install flask_restful 在models.py中新建一个类,生成表,往里面插入一些数据.(flask要想使用ORM的话需 ...

  6. windows安装cnpm步骤

    1.首先前往nodejs官网下载nodejs 2.安装nodejs 3.打开cmd,输入npm -v,检查npm是否安装成功.成功返回的话返回输出版本号 4.安装cnpm,输入npm install ...

  7. ThreadPoolExecutor参数以及源码介绍

    1.前言 在阿里巴巴的<Java 开发手册>中是这样规定线程池的: 线程池不允许使用 Executors 去创建,而是通过 ThreadPoolExecutor 的方式,这样的处理方式让写 ...

  8. 救救孩子吧,到现在还搞不懂TCP的三次握手四次挥手

    本文在个人技术博客同步发布,详情可用力戳 亦可扫描屏幕右侧二维码关注个人公众号,公众号内有个人联系方式,等你来撩...   前几天发了一个朋友圈,发现暗恋已久的女生给我点了个赞,于是我当晚辗转反侧.彻 ...

  9. 关于Spark RDD 的认识

    一.基本认识 RDD 是Spark大数据计算引擎中,抽象的一种数据结构. RDD(Resilient Distributed Dataset),中文意思是弹性分布式数据集,它是Spark中的基本抽象. ...

  10. 洛谷 P6218 [USACO06NOV] Round Numbers S

    洛谷 P6218 [USACO06NOV] Round Numbers S 题目描述 如果一个正整数的二进制表示中,\(0\) 的数目不小于 \(1\) 的数目,那么它就被称为「圆数」. 例如,\(9 ...