Html5开发总结

【Html5能够离线操作、能否开发Html5离线网络应用程序】

按常理Html5开发出来的是Web网页应用,则需网络连接才能下载并使用,作为Html5对离线应用开发的支持最大的特殊,支持离线需要满足如下条件:

  1. 离线资源缓存:需要一种方式来指明应用程序离线工作时所需的资源文件。这样,浏览器才能在在线状态时,把这些文件缓存到本地。此后,当用户离线访问应用程序时,这些资源文件会自动加载,从而让用户正常使用。HTML5

    中,通过 cache manifest 文件指明需要缓存的资源,并支持自动和手动两种缓存更新方式。

  2. 在线状态检测:开发者需要知道浏览器是否在线,这样才能够针对在线或离线的状态,做出对应的处理。在 HTML5 

    中,提供了两种检测当前网络是否在线的方式。

  3. 本地数据存储:离线时,需要能够把数据存储到本地,以便在线时同步到服务器上。为了满足不同的存储需求,HTML5 提供了 DOM Storage 和 Web

    SQL Database 两种存储机制。前者提供了易用的 key/value 对存储方式,而后者提供了基本的关系数据库存储功能。

:我的网络应用程序包含了很多页面。我是否需要在每个页面都使用manifest属性,或者我可以只在主页中使用?

:你网络服务器中的每个页面都需要一个指向缓存名单的为全部应用程序准备的manifest属性。

你的每一个HTML页面指向你的缓存名单文件,并且你的缓存名单文件由合适的Content-Type头支持。但名单文件里有些啥?这是有趣的事情。

:我需要在我的缓存名单中列出我的HTML页面么?

:是或者不是。如果你所有的网络应用程序被包含在一个单页面,只需要确认页面通过使用manifest属性指向了缓存名单。当你访问一个含有manifest属性的HTML页面,页面本身被假设为网络应用程序的一部分,所以你不需要将它本身列入名单文件。尽管如此,如果你的网络应用程序包含多个页面,你应该在名单文件中列出所有的HTML页面,否则浏览器将不会知道有其他的HTML页面需要下载并缓存。

Html5在移动端的屏幕适应性问题

Html5可以说天生为了移动客户端而存在的,所以开发手机浏览器访问的应用需要自适应手机屏幕

在网页的<head>中增加下面这句话,可以让网页的宽度自动适应手机屏幕的宽度。

<meta name=“viewport” content=“width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes”/>

其中:

width=device-width :表示宽度是设备屏幕的宽度

initial-scale=1.0:表示初始的缩放比例

minimum-scale=0.5:表示最小的缩放比例

maximum-scale=2.0:表示最大的缩放比例

user-scalable=yes:表示用户是否可以调整缩放比例

【Html5

Html5开发总结,布布扣,bubuko.com

时间: 2024-10-14 12:08:50

Html5开发总结的相关文章

HTML5开发培训学院

兄弟连IT教育-www.itxdl.cn    免费教程光盘领取- http://www.hdb.com/party/v7m3u.html HTML5中,大家一直在探讨的问题就是我们到底要用它去开发web好一点还是原生应用好一点,随着h5的发展,这两者间的差异渐渐的融合起来.那么HTML5未来的发展趋势是怎样的呢?选择HTML5开发学院又有那些好处呢? 首先要说的就是移动应用了,如今的手机对生活的重要性甚至高过了电脑,这种优先性的趋势也在慢慢的扩大.如今无论进行什么开发,都会有它的身影,而且一部

web前端之html5开发中常用的开发工具

正所谓“工欲善其事,必先利其器”,对Web开发人员来说,好工具的使用总会给人带来事半功倍的效果.正准备学习HTML5或者已经进行了一段时间的HTML5开发的童鞋,都有必要了解下,HTML5都有哪些开发工具,哪款开发工具更适合我?下面就一一盘点下: 一.HTML5全栈开发工具之Adobe Dreamweaver 首先是大名鼎鼎的Adobe Dreamweaver,Adobe Dreamweaver 软件使设计人员和开发人员能充满自信地构建基于标准的网站.由于同新的 Adobe CS Live 在线

Html5开发——html+css基础二(个人博客一)

今天没有写完,而且写的还有点问题,所以今天就先不上传代码了(ps:快写完了才发现布局有问题,导致代码太多,感觉写的不是很好,所以今天先分析一下布局) 第一步先写一个大的div用来放ABC三个部分,这个大的div居中! 第二步分别写ABC三个部分,ABC三个部分分别使用浮动(float)来定位.A和B都各使用了一张非常小的图片,通过重复(repeat)属性生成A和B 第三步C部分分别写好3~16这几个模块,在通过组合利用浮动定位.分组如下: E:3 F:4.7.10.13 G:5.8.11.14

Html5开发——html+css基础一(百度首页)

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>百度</title> <style type="text/css"> *{margin: 0;padding: 0;} body{text-align: center;} .header{text-align: right;f

linux-mint下搭建android,angularjs,rails,html5开发环境

目录[-] 必备软件: 环境配置: [open-jdk-6.0] [android-sdk] [ant] [github] [node.js] [rvm](ruby-1.9.3 rails-4.0.0 gemfile) 必备概念: 关于自动化部署我推荐大家参谋一下Fortune Zhang的一篇文章:android开发过程中我是怎么一步步让项目自动化起来的 最新更新链接:https://gist.github.com/Channely/8296901 系统以64bit为例进行配置/2013/11

phonegap+html5开发app的一些总结

1.Css3圆角白边:使用css3圆角效果时,在android某些机器上会产生白边,所以应该在圆角的div外套一个div(背景色和外部相同),然后有圆角效果的div 内部使用自己的背景色 border-radius:5px; box-shadow:inset 0 2px 5px #e1e1e1; <div style=””> <div style=”border-radius:5px;box-shadow:inset 0 2px 5px #e1e1e1;”> </div>

html5开发手机打电话发短信功能,html5的高级开发,html5开发大全,html手机电话短信功能详解

在很多的手机网站上,有打电话和发短信的功能,对于这些功能是如何实现的呢.其实不难,今天我们就用html5来实现他们.简单的让你大开眼界. HTML5 很容易写,但创建网页时,您经常需要重复做同样的任务,如创建表单.在这...有 HTML5 启动模板.空白图片.打电话和发短信.自动完成等等,帮助你提高开发效率的同时,还带来了更炫的功能.好了,我们今天就来做一做看看效果吧!! 看代码: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitio

常用的html5开发工具有哪些

HTML5被看做是web开发者创建流行web应用的利器,增加了对视频和Canvas 2D的支持.用HTML5的优点主要在于,这个技术可以进行跨平台的使用.比如你开发了一款HTML5的游戏,你可以很轻易地移植到UC的开放平台.Opera的游戏中心.Facebook应用平台,甚至可以通过封装的技术发放到App Store或Google Play上,所以它的跨平台性非常强大,这也是大多数人对HTML5有兴趣的主要原因. 今天,小编将为大家推荐几个主流的HTML5开发http://www.maizied

html5开发移动端app的7大优势(一)

移动web端APP是如今市场份额占据霸主,自html5开发语言正式封稿后,使用html5语言开发app应用带来的用户体验和制作难度是其他语言远远不如的.本文华清创客学院为读者解析html5开发移动端app的7大优势.让对html5感兴趣的读者更好的了解html5网页开发技术. html5开发移动端app的7大优势(一): 1.跨平台: 开发者的幸福指数随着多屏时代的来临岌岌可危.人人都期盼HTML5能扮演救星.多套代码.不同技术工种.业务逻辑同步,这是折磨人的过程.有点类似个人电脑早期世界,那个