如何利用html5开发android界面
三种解决方式：1 viewport属性 2 CSS控制 3 JS控制1 viewport属性放在HTML的<meta>中<SPAN style="FONT-SIZE: x-small"> <head> <title>Exmaple</title> <meta name=”viewport” content=”width=device-width,user-scalable=no”/> </head></SPAN> meta中viewport的属性如下<SPAN style="FONT-SIZE: x-small"> <meta name="viewport" content=" height = [pixel_value | device-height] , width = [pixel_value | device-width ] , initial-scale = float_value , minimum-scale = float_value , maximum-scale = float_value , user-scalable = [yes | no] , target-densitydpi = [dpi_value | device-dpi | high-dpi | medium-dpi | low-dpi] " /></SPAN> 2 CSS控制设备密度为每种密度创建独立的样式表（注意其中的webkit-device-pixel-ratio 3个数值对应3种分辨率）<link rel="stylesheet" media="screen and (-webkit-device-pixel-ratio: 1.5)" href="hdpi.css" /> <link rel="stylesheet" media="screen and (-webkit-device-pixel-ratio: 1.0)" href="mdpi.css" /> <link rel="stylesheet" media="screen and (-webkit-device-pixel-ratio: 0.75)" href="ldpi.css" /> 在一个样式表中，指定不同的样式WebView myWebView = (WebView) findViewById(R.id.webview); myWebView.setWebViewClient(new MyWebViewClient()); 另外出于用户习惯上的考虑 需要将WebView表现得更像一个浏览器，也就是需要可以回退历史记录因此需要覆盖系统的回退键 goBack，goForward可向前向后浏览历史页面Java代码 public boolean onKeyDown(int keyCode, KeyEvent event) { if ((keyCode == KeyEvent.KEYCODE_BACK) && myWebView.canGoBack() { myWebView.goBack(); return true; } return super.onKeyDown(keyCode, event); } //处理javascript中的confirm public boolean onJsConfirm(WebView view, String url, String message, final JsResult result) { Builder builder = new Builder(MainActivity.this); builder.setTitle("confirm"); builder.setMessage(message); builder.setPositiveButton(android.R.string.ok, new AlertDialog.OnClickListener() { public void onClick(DialogInterface dialog, int which) { result.confirm(); } }); builder.setNegativeButton(android.R.string.cancel, new DialogInterface.OnClickListener() { public void onClick(DialogInterface dialog, int which) { result.cancel(); } }); builder.setCancelable(false); builder.create(); builder.show(); return true; }; @Override //设置网页加载的进度条 public void onProgressChanged(WebView view, int newProgress) { MainActivity.this.getWindow().setFeatureInt(Window.FEATURE_PROGRESS, newProgress * 100); super.onProgressChanged(view, newProgress); } //设置应用程序的标题title public void onReceivedTitle(WebView view, String title) { MainActivity.this.setTitle(title); super.onReceivedTitle(view, title); } }); ● Android中的调试通过JS代码输出log信息Js代码 Js代码： console.log("Hello World"); Log信息： Console: Hello World http://www.example.com/hello.html :82 在WebChromeClient中实现onConsoleMesaage()回调方法，让其在LogCat中打印信息Java代码 复制代码 收藏代码WebView myWebView = (WebView) findViewById(R.id.webview); myWebView.setWebChromeClient(new WebChromeClient() { public void onConsoleMessage(String message, int lineNumber, String sourceID) { Log.d("MyApplication", message + " -- From line " + lineNumber + " of " + sourceID); } }); 以及Java代码 WebView myWebView = (WebView) findViewById(R.id.webview); myWebView.setWebChromeClient(new WebChromeClient() { public boolean onConsoleMessage(ConsoleMessage cm) { Log.d("MyApplication", cm.message() + " -- From line " + cm.lineNumber() + " of " + cm.sourceId() ); return true; } }); *ConsoleMessage 还包括一个 MessageLevel 表示控制台传递信息类型。 您可以用messageLevel()查询信息级别，以确定信息的严重程度，然后使用适当的Log方法或采取其他适当的措施。 ● HTML5本地存储在Android中的应用HTML5提供了2种客户端存储数据新方法：localStorage 没有时间限制sessionStorage 针对一个Session的数据存储 Js代码<script type="text/javascript"> localStorage.lastname="Smith"; document.write(localStorage.lastname); </script> <script type="text/javascript"> sessionStorage.lastname="Smith"; document.write(sessionStorage.lastname); </script> WebStorage的API://清空storage localStorage.clear(); //设置一个键值 localStorage.setItem(“yarin”,“yangfegnsheng”); //获取一个键值 localStorage.getItem(“yarin”); //获取指定下标的键的名称（如同Array） localStorage.key(0); //return “fresh” //删除一个键值 localStorage.removeItem(“yarin”); 注意一定要在设置中开启哦 setDomStorageEnabled（true） 在Android中进行操作//启用数据库 webSettings.setDatabaseEnabled(true); String dir = this.getApplicationContext().getDir("database", Context.MODE_PRIVATE).getPath(); //设置数据库路径 webSettings.setDatabasePath(dir); //使用localStorage则必须打开 webSettings.setDomStorageEnabled(true); //扩充数据库的容量（在WebChromeClinet中实现） public void onExceededDatabaseQuota(String url, String databaseIdentifier, long currentQuota, long estimatedSize, long totalUsedQuota, WebStorage.QuotaUpdater quotaUpdater) { quotaUpdater.updateQuota(estimatedSize * 2); } 在JS中按常规进行数据库操作function initDatabase() { try { if (!window.openDatabase) { alert("Databases are not supported by your browser"); } else { var shortName = "YARINDB"; var version = "1.0"; var displayName = "yarin db"; var maxSize = 100000; // in bytes YARINDB = openDatabase(shortName, version, displayName, maxSize); createTables(); selectAll(); } } catch(e) { if (e == 2) { // Version mismatch. console.log("Invalid database version."); } else { console.log("Unknown error "+ e +"."); } return; } } function createTables(){ YARINDB.transaction( function (transaction) { transaction.executeSql("CREATE TABLE IF NOT EXISTS yarin(id INTEGER NOT NULL PRIMARY KEY, name TEXT NOT NULL,desc TEXT NOT NULL);", [], nullDataHandler, errorHandler); } ); insertData(); } function insertData(){ YARINDB.transaction( function (transaction) { //Starter data when page is initialized var data = ["1","yarin yang","I am yarin"]; transaction.executeSql("INSERT INTO yarin(id, name, desc) VALUES (?, ?, ?)", [data[0], data[1], data[2]]); } ); } function errorHandler(transaction, error){ if (error.code==1){ // DB Table already exists } else { // Error is a human-readable string. console.log("Oops. Error was "+error.message+" (Code "+error.code+")"); } return false; } function nullDataHandler(){ console.log("SQL Query Succeeded"); } function selectAll(){ YARINDB.transaction( function (transaction) { transaction.executeSql("SELECT * FROM yarin;", [], dataSelectHandler, errorHandler); } ); } function dataSelectHandler(transaction, results){ // Handle the results for (var i=0; i<results.rows.length; i++) { var row = results.rows.item(i); var newFeature = new Object(); newFeature.name = row["name"]; newFeature.decs = row["desc"]; document.getElementByIdx_x_x_x("name").innerHTML="name:"+newFeature.name; document.getElementByIdx_x_x_x("desc").innerHTML="desc:"+newFeature.decs; } } function updateData(){ YARINDB.transaction( function (transaction) { var data = ["fengsheng yang","I am fengsheng"]; transaction.executeSql("UPDATE yarin SET name=?, desc=? WHERE id = 1", [data[0], data[1]]); } ); selectAll(); } function ddeleteTables(){ YARINDB.transaction( function (transaction) { transaction.executeSql("DROP TABLE yarin;", [], nullDataHandler, errorHandler); } ); console.log("Table "page_settings" has been dropped."); } 注意onLoad中的初始化工作 function initLocalStorage(){ if (window.localStorage) { textarea.addEventListener("keyup", function() { window.localStorage["value"] = this.value; window.localStorage["time"] = new Date().getTime(); }, false); } else { alert("LocalStorage are not supported in this browser."); } } window.onload = function() { initDatabase(); initLocalStorage(); } ● HTML5地理位置服务在Android中的应用//启用地理定位 webSettings.setGeolocationEnabled(true); //设置定位的数据库路径 webSettings.setGeolocationDatabasePath(dir); //配置权限（同样在WebChromeClient中实现） public void onGeolocationPermissionsShowPrompt(String origin, GeolocationPermissions.Callback callback) { callback.invoke(origin, true, false); super.onGeolocationPermissionsShowPrompt(origin, callback); } HTML5中 通过navigator.geolocation对象获取地理位置信息常用的navigator.geolocation对象有以下三种方法： Js代码//获取当前地理位置 navigator.geolocation.getCurrentPosition(success_callback_function, error_callback_function, position_options) //持续获取地理位置 navigator.geolocation.watchPosition(success_callback_function, error_callback_function, position_options) //清除持续获取地理位置事件 navigator.geolocation.clearWatch(watch_position_id) 其中success_callback_function为成功之后处理的函数，error_callback_function为失败之后返回的处理函数，参数position_options是配置项//定位 function get_location() { if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(show_map,handle_error,{enableHighAccuracy:false,maximumAge:1000,timeout:15000}); } else { alert("Your browser does not support HTML5 geoLocation"); } }
如何让webbrowser控件支持Html5
代码如下：using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threading.Tasks;using Xilium.CefGlue; namespace Xilium.CefGlue.WindowsForms{ public class BsLifeSpanHandler : CefLifeSpanHandler { private CefWebClient bClient; public BsLifeSpanHandler(CefWebClient bc) { bClient = bc; } protected override void OnAfterCreated(Xilium.CefGlue.CefBrowser browser) { base.OnAfterCreated(browser); bClient.Created(browser); } }}然后打开CefWebClient.cs文件，添加声明1private readonly CefDownloadHandler downloadHandler;在构造函数中加入1downloadHandler = new BsDownloadHandler();然后添加一个方法名在文档末尾 protected override CefDownloadHandler GetDownloadHandler() { return downloadHandler; }
如何让webbrowser控件支持Html5
跟随窗体变化大小要在resize事件中，举例说明PrivateSubForm_Resize()WebBrowser1.Move10,10,Me.ScaleWidth-20,Me.ScaleHeight-20EndSub
想学习HTML5，有什么好的书籍推荐吗？
HTML5 是html的第五版本，更加语义化，以及一些新的标签。比如画布canvas，个人觉得这些可以在网上找一些材料学习，网上有很多在线学习的地方 比如 w3c 菜鸟教程等等，都有html5专区的学习，像canvas学的话 可能要化一点时间 祝你好运
怎样开发优秀的HTML5游戏-迪斯尼《寻找奥兹之路》游戏技术详解（一）
前言 迪斯尼《Find Your Way to OZ》这个贴近地气的游戏我在最新一期《程序员》杂志的《从HTML5移动应用现状谈发展趋势》这篇文章里有所提及，它借用了近期上映的《魔境仙踪》电影的设定（设定来自于经典故事《绿野仙踪》，看过这个电影的同学们会深有感触），构建了一个等同的宏大游戏世界。同时迪斯尼又和谷歌合作，把它作为Chrome浏览器性能和HTML5技术的一个show case。对于这样一个使用了WebGL 3D、摄像头、3D音效等多种先进技术、支持桌面和移动端、品质出色的HTML5游戏，了解它背后的实现原理和技巧必然对于我们来说有着非常巨大的参考意义。 这篇文章我早就想翻译出来，帮助大家更好的了解HTML5在游戏开发里的应用和国外的应用情况，但是这篇文章实在太长，所以只能分次刊载，以飨读者。 此教程在我近期HTML5介绍的文章中难度可称高级，适合有一定经验的开发者阅读和学习。 介绍 “寻找奥兹之路”是迪斯尼为谷歌Chrome带来的全新体验。它让你在互动的旅程中穿越堪萨斯马戏团，然后通过一个巨大的风暴到达奥兹王国。 我们的目标是结合浏览器的技术能力，以创建一种充满乐趣、身临其境的体验，用户可以与电影之间形成一个强大的联系。 这个游戏的工作实在是太庞大，所以我们只能列出一些章节，把我们认为有趣的技术故事写出来。教程的难度随着进度会逐渐增加。 我们有很多人努力工作来创建更好的体验，但是太多无法一一列举。请访问该网站，体验整个页面下的完整故事。 预览 在PC端《寻找奥兹之路》是一个丰富的身临其境的世界。我们把3D和传统的电影制作灵感结合起来，创造一个好几层的接近现实的场景效果。其中最突出的技术是用Three.js引入WebGL，使用CSS3特性来定制着色器和DOM动画元素。除此之外，getUserMedia API（WebRTC）增强了互动体验，允许用户直接从摄像头添加自己的形象，以及WebAudio带来了3D音效。 但是这种技术体验的神奇之处在于它们是如何融合为一体的。这也是面临的主要挑战之一：如何把视觉效果和互动元素融合在一起来创建一个一致的场景？这种视觉的复杂性非常难以管理：很难说清楚我们在任何一个时间需要开发什么场景。 为了解决视觉效果和优化这一问题，我们大量使用了一个控制面板，用于捕获我们正在检查的那个时间点的所有相关设置。在浏览器中可以实时修正场景中的一切，例如亮度，纵向深度，伽玛线等等。任何人都可以在体验中尝试调整重要参数的值，参与并发现什么效果最好。 在分享我们的秘密之前，我要提醒你，它可能会导致崩溃。确保你没有正在浏览什么重要的东西，并且在访问该网站的网址时添加?debug=on。等待网站加载，一旦你进入后按Ctrl+I键，会看到右手边出现一个下拉菜单。如果取消选中“退出相机路径”选项，你可以使用A、W、S、D键和鼠标在空间中自由的移动。 我们不会详述这里的所有设置，但是我们鼓励你试验：按键显示不同的场景中不同的设置。在最后的风暴场景中有一组额外的按键：Ctrl+A，可以切换播放的动画。在这个场景中，如果你按Esc（退出鼠标锁定功能），再次按下Ctrl+I键可以进入风暴场景的特殊设置。看看四周，并且截取一些像下面这样的漂亮明信片。 要做到这一点以确保其对我们的需求具有足够的灵活性，我们采用了一个很棒的名为dat.gui的框架（可以在这里看看过去关于如何使用它的教程）。它允许我们能够迅速改变暴露给游客的设置。 有点像绘景 许多经典的迪士尼电影和动画创建场景意味着合并不同的层。有外景层、单元动画层，以及物理设置层和通过玻璃绘画获得的顶层：这种技术称为绘景。 在许多方面我们创造的体验的结构是相似的，即使有些“层”远远超过了静态的视觉效果。事实上，它们根据更为复杂的计算影响事物看起来的方式。然而，至少在大画面的水平，我们处理视图，将一个合成到另外一个之上合。在顶部，你看到一个UI层，其下是3D场景：它由不同的场景组件组成。 顶部接口层使用DOM和CSS 3创建。事件通信使用Backbone路由器+ onHashChange HTML5事件来控制哪块区域响应动画。（项目源代码：/develop/coffee/router/Router.coffee）。 教程：Sprite表和视网膜支持 我们依赖一种有趣的优化技术，把多个接口层图像合并为一张单独的PNG来减少服务器请求。在这个项目中，接口由多于70 张的图像组成（不包括3D纹理），并且全部预加载以减少网站延迟。你可以在这里看到最新的Sprite表： 正常显示 Retina显示屏 下面是我们如何发挥Sprite表优势的一些技巧，在视网膜设备上如何使用它们，以及如何将接口尽可能设置的简洁而整齐。 创建Sprite表 我们使用TexturePacker来创建任何你需要的Sprite表格式。在这种情况下，我们采用EaselJS，它非常整洁，并且可以用于创建动画Sprite。 使用生成的Sprite表 一旦创建了Sprite表，你应该看到这样的一个JSON文件：{ "images": ["interface_2x.png"], "frames": [ [2, 1837, 88, 130], [2, 2, 1472, 112], [1008, 774, 70, 68], [562, 1960, 86, 86], [473, 1960, 86, 86] ], "animations": { "allow_web":[0], "bottomheader":[1], "button_close":[2], "button_facebook":[3], "button_google":[4] },} 其中： images指向sprite表的地址 frames是每个UI元素的坐标[x, y, width, height] animations 是每项内容的名称 请注意，我们已经使用了高清图像来创建Sprite表，然后我们只需通过调整图像尺寸为一半来创建正常版本。 融合一切 现在，我们只需要一段Javascript代码来使用它。var SSAsset = function (asset, p) { var css, x, y, w, h; // pide the coordinates by 2 as retina devices have 2x density x = Math.round(asset.x / 2); y = Math.round(asset.y / 2); w = Math.round(asset.width / 2); h = Math.round(asset.height / 2); // Create an Object to store CSS attributes css = { width : w, height : h, "background-image" : "url(" + asset.image_1x_url + ")", "background-size" : "" + asset.fullSize[0] + "px " + asset.fullSize[1] + "px", "background-position": "-" + x + "px -" + y + "px" }; // If retina devices if (window.devicePixelRatio === 2) { /* set -webkit-image-set for 1x and 2x All the calculations of X, Y, WIDTH and HEIGHT is taken care by the browser */ css["background-image"] = "-webkit-image-set(url(" + asset.image_1x_url + ") 1x,"; css["background-image"] += "url(" + asset.image_2x_url + ") 2x)"; } // Set the CSS to the p p.css(css);}; 这是你如何使用它的代码：logo = new SSAsset({ fullSize : [1024, 1024], // image 1x dimensions Array [x,y] x : 1790, // asset x coordinate on SpriteSheet y : 603, // asset y coordinate on SpriteSheet width : 122, // asset width height : 150, // asset height image_1x_url : "img/spritesheet_1x.png", // background image 1x URL image_2x_url : "img/spritesheet_2x.png" // background image 2x URL},$("#logo")); 在这里下载完整的示例 如果要多了解一些可变像素密度，你可以看看Boris SMUS的这篇文章。 3D内容管道 环境体验建立在WebGL层之上。当你想到一个3D场景，最棘手的问题之一是要如何确保你从建模，动画和特效这些领域都可以创建最富有表现潜力的内容。从许多方面来说，这个问题的核心是内容管道：用一个定好的程序从3D场景来创建内容。 我们想创造一个令人振奋的世界，所以需要一个可靠的进程帮助3D艺术家来创建它。他们将需要给予他们的三维建模和动画软件尽可能多的表达自由，而我们将需要通过代码将它们呈现在屏幕上。 我们在这类问题上已经工作了一段时间，因为过去每次我们创建了一个3D网站，所以发现之前使用工具的一些限制。后来我们创造了这个被称为3D Librarian的工具，正准备要把它应用到真正的工作上。 这个工具有一些历史：它最初是为了Flash诞生的，它会允许你把一个大的Maya场景作为一个单一的压缩文件为拆包运行时进行优化。这是最优的原因是因为它有效的把场景包装为基本相同的数据结构，在渲染和动画时进行操作。这样在文件加载时只需要做很少的解析。Flash中的解包速度非常快，因为文件是AMF格式，Flash能够原生解压。在WebGL中使用相同的格式，需要CPU多做一些工作。事实上，我们不得不重新创建一个解压数据JavaScript代码层，这基本上会将这些文件解压，并重新创建WebGL所需的数据结构。解压整个3D场景是对CPU有一些负担：解包游戏的场景1在中高端机上需要约2秒钟。所以为此我们在“场景设置”时间（实际上是场景出现之前）用Web Workers技术来实现，所以不会影响用户的体验。 这个方便的工具可以导入3D场景：模型、纹理和骨骼动画。你可以创建一个单一的库文件，它稍后能被3D引擎所载入。 不过我们曾经遇到一个问题，现在用WebGL来处理。因此，我们创建了一个特定的JavaScript层，使用3D库来压缩3D场景文件，并把它们翻译成正确的WebGL能理解的格式。 教程：要有风 在“寻找奥兹之路”中一个反复出现的主题就是风。剧情的主线由弱到强的风所串起。 狂欢节的第一个场景相对平静。经历各种场景，用户逐渐体验强风，最后来到最终的场景，风暴中。 因此，重要的是提供一个身临其境的风的效果。 为了实现这种效果，我们在3个狂欢节的场景中填充比较软的对象，例如帐篷和气球。
html5+php如何实现文件拖动上传功能
[导读] 本文章介绍了关于在html5中实现文件上传的功能介绍，有需要的同学可以参考一下下哈。界面样式我是参考了一个国外的相册网站，改动不大，只是把鸟语转换成中文，以及上传时的样式也进行了改动，之所以选这个本文章介绍了关于在html5中实现文件上传的功能介绍，有需要的同学可以参考一下下哈。界面样式我是参考了一个国外的相册网站，改动不大，只是把鸟语转换成中文，以及上传时的样式也进行了改动，之所以选这个的原因就是，我很容易做扩展，它支持3种方式添加图片，一种拖拽上传，一种常规的选择文件上传，另外的就是添加网络图片。它很巧妙的把三种上传模式整合到了一起，而且你可以用IE浏览器浏览下，如果不支持HTML5，是没有拖拽上传图片的提示的，如图：拖拽上传最重要的就是js部分的代码，它实现了70%的功能，另外30%仅仅是把图片信息提交到后台，然后做对应的处理，比如压缩啊，裁剪啊云云。所以先来看下js实现代码吧。 代码如下 <!DOCTYPE HTML><html><head><meta charset="utf-8"><title>无标题文档</title><script src="js/jquery-1.7.1.min.js"></script><style>.dashboard_target_box{width:250px;height:105px;border:3px dashed #E5E5E5;text-align:center;position:absolute;z-index:2000;top:0;left:0;cursor:pointer}.dashboard_target_box.over{border:3px dashed #000;background:#ffa}.dashboard_target_messages_container{display:inline-block;margin:12px 0 0;position:relative;text-align:center;height:44px;overflow:hidden;z-index:2000}.dashboard_target_box_message{position:relative;margin:4px auto;font:15px/18px helvetica,arial,sans-serif;font-size:15px;color:#999;font-weight:normal;width:150px;line-height:20px}.dashboard_target_box.over #dtb-msg1{color:#000;font-weight:bold}.dashboard_target_box.over #dtb-msg3{color:#ffa;border-color:#ffa}#dtb-msg2{color:orange}#dtb-msg3{display:block;border-top:1px #EEE dotted;padding:8px 24px}</style><script>$().ready(function(){ if($.browser.safari || $.browser.mozilla){ $("#dtb-msg1 .compatible").show(); $("#dtb-msg1 .notcompatible").hide(); $("#drop_zone_home").hover(function(){ $(this).children("p").stop().animate({top:"0px"},200); },function(){ $(this).children("p").stop().animate({top:"-44px"},200); }); //功能实现 $(document).on({ dragleave:function(e){ e.preventDefault(); $(".dashboard_target_box").removeClass("over"); }, drop:function(e){ e.preventDefault(); //$(".dashboard_target_box").removeClass("over"); }, dragenter:function(e){ e.preventDefault(); $(".dashboard_target_box").addClass("over"); }, dragover:function(e){ e.preventDefault(); $(".dashboard_target_box").addClass("over"); } }); var box = document.getElementById("target_box"); box.addEventListener("drop",function(e){ e.preventDefault(); //获取文件列表 var fileList = e.dataTransfer.files; var img = document.createElement("img"); //检测是否是拖拽文件到页面的操作 if(fileList.length == 0){ $(".dashboard_target_box").removeClass("over"); return; } //检测文件是不是图片 if(fileList[0].type.indexOf("image") === -1){ $(".dashboard_target_box").removeClass("over"); return; } if($.browser.safari){ //Chrome8+ img.src = window.webkitURL.createObjectURL(fileList[0]); }else if($.browser.mozilla){ //FF4+ img.src = window.URL.createObjectURL(fileList[0]); }else{ //实例化file reader对象 var reader = new FileReader(); reader.onload = function(e){ img.src = this.result; $(document.body).appendChild(img); } reader.readAsDataURL(fileList[0]); } var xhr = new XMLHttpRequest(); xhr.open("post", "test.php", true); xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest"); xhr.upload.addEventListener("progress", function(e){ $("#dtb-msg3").hide(); $("#dtb-msg4 span").show(); $("#dtb-msg4").children("span").eq(1).css({width:"0px"}); $(".show").html(""); if(e.lengthComputable){ var loaded = Math.ceil((e.loaded / e.total) * 100); $("#dtb-msg4").children("span").eq(1).css({width:(loaded*2)+"px"}); } }, false); xhr.addEventListener("load", function(e){ $(".dashboard_target_box").removeClass("over"); $("#dtb-msg3").show(); $("#dtb-msg4 span").hide(); var result = jQuery.parseJSON(e.target.responseText); alert(result.filename); $(".show").append(result.img); }, false); var fd = new FormData(); fd.append("xfile", fileList[0]); xhr.send(fd); },false); }else{ $("#dtb-msg1 .compatible").hide(); $("#dtb-msg1 .notcompatible").show(); }});</script></head><body><p id="target_box" class="dashboard_target_box"> <p id="drop_zone_home" class="dashboard_target_messages_container"> <p id="dtb-msg2" class="dashboard_target_box_message" style="top:-44px">选择你的图片<br>开始上传</p> <p id="dtb-msg1" class="dashboard_target_box_message" style="top:-44px"> <span class="compatible" style="display:inline">拖动图片到</span><span class="notcompatible" style="display:none">点</span>这里<br>开始上传图片 </p> </p> <p id="dtb-msg3" class="dashboard_target_box_message">选择网络图片</p> <p id="dtb-msg4" class="dashboard_target_box_message" style="position:relative"> <span style="display:none;width:200px;height:2px;background:#ccc;left:-25px;position:absolute;z-index:1"></span> <span style="display:none;width:0px;height:2px;background:#09F;left:-25px;position:absolute;z-index:2"></span> </p></p><p class="show" style="float:left;width:300px;height:150px;border:1px solid red;margin-top:200px;overflow:hidden;"></p></body></html>test.php文件 代码如下 <?php $r = new stdClass(); header("content-type: application/json"); $maxsize = 10; //Mb if($_FILES["xfile"]["size"] > ($maxsize * 1048576)){ $r->error = "图片大小">图片大小不超过 $maxsize MB"; } $folder = "files/"; if(!is_dir($folder)){ mkdir($folder); } $folder .= $_POST["folder"] ? $_POST["folder"] . "/" : ""; if(!is_dir($folder)){ mkdir($folder); } if(preg_match("/image/i", $_FILES["xfile"]["type"])){ $filename = $_POST["value"] ? $_POST["value"] : $folder . sha1(@microtime() . "-" . $_FILES["xfile"]["name"]) . ".jpg"; }else{ $tld = split(",", $_FILES["xfile"]["name"]); $tld = $tld[count($tld) - 1]; $filename = $_POST["value"] ? $_POST["value"] : $folder . sha1(@microtime() . "-" . $_FILES["xfile"]["name"]) . $tld; } $types = Array("image/png", "image/gif", "image/jpeg"); if(in_array($_FILES["xfile"]["type"], $types)){ $source = file_get_contents($_FILES["xfile"]["tmp_name"]); imageresize($source, $filename, $_POST["width"], $_POST["height"], $_POST["crop"], $_POST["quality"]); }else{ move_uploaded_file($_FILES["xfile"]["tmp_name"], $filename); } $path = str_replace("test.php", "", $_SERVER["SCRIPT_NAME"]); $r->filename = $filename; $r->path = $path; $r->img = "<img src="" . $path . $filename . "" alt="image" />"; echo json_encode($r); function imageresize($source, $destination, $width = 0, $height = 0, $crop = false, $quality = 80) { $quality = $quality ? $quality : 80; $image = imagecreatefromstring($source); if ($image) { // Get dimensions $w = imagesx($image); $h = imagesy($image); if (($width && $w > $width) || ($height && $h > $height)) { $ratio = $w / $h; if (($ratio >= 1 || $height == 0) && $width && !$crop) { $new_height = $width / $ratio; $new_width = $width; } elseif ($crop && $ratio <= ($width / $height)) { $new_height = $width / $ratio; $new_width = $width; } else { $new_width = $height * $ratio; $new_height = $height; } } else { $new_width = $w; $new_height = $h; } $x_mid = $new_width * .5; //horizontal middle $y_mid = $new_height * .5; //vertical middle // Resample error_log("height: " . $new_height . " - width: " . $new_width); $new = imagecreatetruecolor(round($new_width), round($new_height)); imagecopyresampled($new, $image, 0, 0, 0, 0, $new_width, $new_height, $w, $h); // Crop if ($crop) { $crop = imagecreatetruecolor($width ? $width : $new_width, $height ? $height : $new_height); imagecopyresampled($crop, $new, 0, 0, ($x_mid - ($width * .5)), 0, $width, $height, $width, $height); //($y_mid - ($height * .5)) } // Output // Enable interlancing [for progressive JPEG] imageinterlace($crop ? $crop : $new, true); $dext = strtolower(pathinfo($destination, PATHINFO_EXTENSION)); if ($dext == "") { $dext = $ext; $destination .= "." . $ext; } switch ($dext) { case "jpeg": case "jpg": imagejpeg($crop ? $crop : $new, $destination, $quality); break; case "png": $pngQuality = ($quality - 100) / 11.111111; $pngQuality = round(abs($pngQuality)); imagepng($crop ? $crop : $new, $destination, $pngQuality); break; case "gif": imagegif($crop ? $crop : $new, $destination); break;
如何使用css3+html5来制作文字霓虹灯效果（付完整代码）
在科技日益发展的今天，人们对于审美越来越挑剔，这就要求我们对于前端开发的态度更加的严谨的同时，需要加入新鲜的元素，以达到吸引目光的目的。那么今天本文带大家了解一下如何使用css3+html5来制作文字霓虹灯效果，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。使用css3+html5来制作文字霓虹灯效果的特点文字带有闪烁的霓虹灯动画，且文字选中时也有很酷的动画特效；文字可动态输入，且输入的文字实时渲染霓虹灯特效。使用css3+html5来制作文字霓虹灯效果的步骤输入需要加入特效的文本。利用box-shadow的多层阴影属性，绘制霓虹管的立体效果。利用text-shadow多层阴影，绘制文字灯管，发光，投影，达到设置立体文字的效果。这里我们着重介绍一下实现霓虹灯闪烁效果的原理我们需要在文本上设置两个标签，并且让他们完全重合，上层实现灯管效果，下层实现光晕效果，再利用选择器使其不断闪烁，同时我们需要设置熄灭和点亮两个状态的text-shadow属性值，使他们以不同速度的切换，就形成了霓虹灯闪烁的效果。注意：如有对于以上内容不理解的小伙伴可以查看本站内其他文章如何使用css3实现图片的简单阴影效果（附完整代码）如何使用css3实现字体内发光效果（详解）使用css3+html5来制作文字霓虹灯效果的代码<!DOCTYPE html><html><head><meta charset="UTF-8"><title>css3 html5文字霓虹灯交替闪烁效果</title><style>html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed,figure, figcaption, footer, header, hgroup,menu, nav, output, ruby, section, summary,time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}/* HTML5 display-role reset for older browsers */article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section { display: block;}body { line-height: 1;}ol, ul { list-style: none;}blockquote, q { quotes: none;}blockquote:before, blockquote:after,q:before, q:after { content: ""; content: none;}table { border-collapse: collapse; border-spacing: 0;} body { background-color: #222; background-image: -webkit-radial-gradient(circle, #333, #222, #111); background-attachment: fixed; overflow: hidden; font-family: "Wire One", sans-serif; font-size: 6em; color: #FFF; line-height: normal; text-align: center;}#glow { position: absolute; top: 0; bottom: 0; width: 100%; height: 1em; margin: auto; display: block;}#glow p,#glow span{ display: inline-block; color: #FFF; text-shadow: 0 0 15px;}#glow p:nth-child(odd) { -webkit-animation: bglow .3s ease infinite;}#glow p:nth-child(even) { -webkit-animation: rglow .3s ease infinite;}@-webkit-keyframes bglow { 0% { color: rgb(0, 135, 211); text-shadow: 0 0 15px; }}@-webkit-keyframes rglow { 100% { color: rgb(233, 54, 40); text-shadow: 0 0 15px; }} </style> <script> window.confirm = function(){}; window.prompt = function(){}; window.open = function(){}; window.print = function(){}; // Support hover state for mobile. if (false) { window.ontouchstart = function(){}; } </script></head><body> <section id="glow"> <p>P</p> <p>H</p> <p>P</p> <p>中</p> <p>文</p> <p>网</p></section> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> <script> if (document.location.search.match(/type=embed/gi)) { window.parent.postMessage("resize", "*"); } </script></body></html>文字霓虹灯效果如图所示总结刚开始以为文字霓虹灯效果是gif动画之类的，审查元素发现居然是用html5 + CSS3动画实现的，顿时激起了我的(hao)欲(qi)望(xin)，决定要一探究竟，查看代码之后，发现原理居然是如此简单，希望本文内容可以为大家带来帮助。
html5有什么快捷键实现注释
这个和实用的软件有关系，编程软件不同，方式不同，比如我用的是webstorm，注释快捷键就是ctrl+/
html5 的视频播放器 能支持 mpg格式吗 帮忙
html5的视频格式到现在仍未统一，所以各浏览器的支持情况不一样。理论上mp4 webm ogv mpg等都支持，但各浏览器有差异。(貌似还没有支持mpg，要转格式)你可以准备多个相同内容、格式不同的视频，浏览器会找到他能播放的那个来播放，官方标准是.ogg视频；<video width="320" height="240" controls="controls"> <source src="a.ogg" type="video/ogg"> <source src="a.mp4" type="video/mp4"> your browser does not support the video tag.</video>
服务端HTML5，JS怎么读写手机客户端的本地文件？
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> #content{width:600px; height:300px; border: 1px solid #ddd; overflow: auto; margin-top:10px;} </style> </head> <body> <input type="file" name="" id="myFile" value="" multiple="multiple" /> </body> <div id="content"></div></html><script type="text/javascript"> window.onload = function() { var oFile = document.getElementById("myFile"); var oCotnent = document.getElementById("content"); oFile.addEventListener("change", function(ev) { var event = ev || window.event; var files = this.files; for (var i = 0, len = files.length; i < len; i++) { var reader = new FileReader(); var file = files[i]; reader.onload = (function(file) { return function(e) { var div = document.createElement("div"); div.innerHTML =this.result; oCotnent.insertBefore(div, null); }; })(file); //读取文件内容 reader.readAsText(file,"utf-8"); } }, false); }</script>
lotus notes支持html5吗
不支持的。Lotus Notes/Domino 是一个世界领先的企业级通讯、协同工作及Internet/Intranet平台；具有完善的工作流控制、数据库复制技术和完善可靠的安全机制；尤其适合于处理各种非结构化与半结构化的文档数据、建立工作流应用、建立各类基于Web的应用。它全面实现了对非结构化信息的管理和共享，内含强大的电子邮件功能及工作流软件开发环境，是实现群组协同工作、办公自动化的最佳开发环境。
什么是 HTML5 Boilerplate
HTML5 Boilerplate 是一套专业的前端模版,用以开发快速、健壮、适应性强的app或网站。 这个小小的源码包集合了100位开发者的经验，你可以将这些经验运用在你的项目中。 HTML Boilerplate 是一套具有非常多先进特性的框架，其特性简单介绍如下：（1）由 Paul Irish 首创的在 HTML 页面的 body 上使用 IE 条件注释判断浏览器版本，从而大大简化了针对 IE Hack 的成本（在后来的版本中升级为在 <html> 标签中加入条件注释）（2）HTML5 集成，默认使用了很多 HTML5 的特性，并且使其兼容旧版本浏览器大量针对服务器的默认配置，无需修改即可配置一个安全、标准的 web 服务器（3）完整的 JS 调试机制 —— 即使在 IE 下（4）大量使用 CSS3 技术，并且集成了几乎所有来自框架中和技术大牛们口头相传的 CSS 技巧（5）为所有浏览环境做了优化，包括移动版本和打印版本（6）默认内置 Modernizr，可以检测浏览器对新特性的支持能力，方便针对旧版本浏览器优化
什么是 HTML5 Boilerplate
HTML5 Boilerplate 是一套专业的前端模版,用以开发快速、健壮、适应性强的app或网站。这个小小的源码包集合了100位开发者的经验，你可以将这些经验运用在你的项目中。HTML Boilerplate 是一套具有非常多先进特性的框架，其特性简单介绍如下：（1）由 Paul Irish 首创的在 HTML 页面的 body 上使用 IE 条件注释判断浏览器版本，从而大大简化了针对 IE Hack 的成本（在后来的版本中升级为在 <html> 标签中加入条件注释）（2）HTML5 集成，默认使用了很多 HTML5 的特性，并且使其兼容旧版本浏览器大量针对服务器的默认配置，无需修改即可配置一个安全、标准的 web 服务器（3）完整的 JS 调试机制 —— 即使在 IE 下（4）大量使用 CSS3 技术，并且集成了几乎所有来自框架中和技术大牛们口头相传的 CSS 技巧（5）为所有浏览环境做了优化，包括移动版本和打印版本（6）默认内置 Modernizr，可以检测浏览器对新特性的支持能力，方便针对旧版本浏览器优化
什么是 HTML5 Boilerplate
什么是奶奶！下雨抱着孙子打着伞，孙子的头还在伞外！！哈哈
什么是 HTML5 Boilerplate
HTML5 Boilerplate 是一个由 Paul Irish（Google Chrome 开发人员、jQuery 项目成员、Modernizr 作者、yayQuery 播客主持人）主导的“前端开发模版”。HTML5 Boilerplate 是一套具有非常多先进特性的框架，其特性简单介绍如下：由 Paul Irish 首创的在 HTML 页面的 body 上使用 IE 条件注释判断浏览器版本，从而大大简化了针对 IE Hack 的成本（在后来的版本中升级为在 <html> 标签中加入条件注释）HTML5 集成，默认使用了很多 HTML5 的特性，并且使其兼容旧版本浏览器大量针对服务器的默认配置，无需修改即可配置一个安全、标准的 web 服务器完整的 JS 调试机制 —— 即使在 IE 下大量使用 CSS3 技术，并且集成了几乎所有来自框架中和技术大牛们口头相传的 CSS 技巧为所有浏览环境做了优化，包括移动版本和打印版本默认内置 Modernizr，可以检测浏览器对新特性的支持能力，方便针对旧版本浏览器优化
html5有没有类似jqueryui的框架
可以去看看Bootstrap，地址：http://www.bootcss.com/
如何使用HTML5 Boilerplate开发Web程序
工具/原料:笔记本电脑或台式机互联网HTML5 Boilerplate谷歌浏览器等主流浏览器1在百度搜索引擎中搜索关键词“HTML5 Boilerplate”，如下图所示。2.访问HTML5 Boilerplate官方网站，如下图所示。3.下载最新版的HTML5 Boilerplate，如下图所示。4.解压HTML5 Boilerplate，工程目录如下图所示。5.HTML5 Boilerplate核心，如下图所示。6.HTML5 Boilerplate HTML基本结构如下图所示
什么是 HTML5 Boilerplate
HTML5 Boilerplate 是一套专业的前端模版,用以开发快速、健壮、适应性强的app或网站。 这个小小的源码包集合了100位开发者的经验，你可以将这些经验运用在你的项目中。 HTML Boilerplate 是一套具有非常多先进特性的框架，其特性简单介绍如下：（1）由 Paul Irish 首创的在 HTML 页面的 body 上使用 IE 条件注释判断浏览器版本，从而大大简化了针对 IE Hack 的成本（在后来的版本中升级为在 <html> 标签中加入条件注释）（2）HTML5 集成，默认使用了很多 HTML5 的特性，并且使其兼容旧版本浏览器大量针对服务器的默认配置，无需修改即可配置一个安全、标准的 web 服务器（3）完整的 JS 调试机制 —— 即使在 IE 下（4）大量使用 CSS3 技术，并且集成了几乎所有来自框架中和技术大牛们口头相传的 CSS 技巧（5）为所有浏览环境做了优化，包括移动版本和打印版本（6）默认内置 Modernizr，可以检测浏览器对新特性的支持能力，方便针对旧版本浏览器优化
html5 output标签有什么用，W3C用了他的onforminput属性，可是案例一点反应都没有
http://zhidao.baidu.com/link?url=R6c4hFwF2yNwZmbTUjRvAsTKj0_gBUKqhLyJ2ExYEdMiq7ZqJhQC9_imDA7SafpNjvqkeiWsMrJ7smWvpW6dmh32vrfzxifaiokR7VoxShq
什么是HTML5？
HTML 5是近十年来Web开发标准最巨大的飞跃。和以前的版本不同，HTML 5并非仅仅用来表示Web内容，它的新使命是将Web带入一个成熟的应用平台，在HTML 5平台上，视频，音频，图象，动画，以及同电脑的交互都被标准化。什么是 HTML5？HTML5 将成为 HTML、XHTML 以及 HTML DOM 的新标准。HTML 的上一个版本诞生于 1999 年。自从那以后，Web 世界已经经历了巨变。HTML5 仍处于完善之中。然而，大部分现代浏览器已经具备了某些 HTML5 支持。HTML5 是如何起步的？HTML5 是 W3C 与 WHATWG 合作的结果。注1：W3C 指 World Wide Web Consortium，万维网联盟。注2：WHATWG 指 Web Hypertext Application Technology Working Group。WHATWG 致力于 web 表单和应用程序，而 W3C 专注于 XHTML 2.0。在 2006 年，双方决定进行合作，来创建一个新版本的 HTML。为 HTML5 建立的一些规则：新特性应该基于 HTML、CSS、DOM 以及 JavaScript。减少对外部插件的需求（比如 Flash）更优秀的错误处理更多取代脚本的标记HTML5 应该独立于设备开发进程应对公众透明HTML5草案的前身名为Web Applications 1.0。于2004年被WHATWG提出， 于2007年被W3C接纳，并成立了新的HTML工作团队。在2008年1月22日，第一份正式草案已公布,预计将在2010年9月正式向公众推荐。WHATWG表示该规范是目前正在进行的工作，仍须多年的努力。新标记HTML5提供了一些新的元素和属性，例如（网站导航块）和。这种标签将有利于搜索引擎的索引整理，同时更好的帮助小屏幕装置和视障人士使用，除此之外，还为其他浏览要素提供了新的功能，如和标记。一些过时的HTML4标记将被取消。其中包括纯粹显示效果的标记，如和，它们已经被CSS取代。新特性HTML5 中的一些有趣的新特性：用于绘画的 canvas 元素用于媒介回放的 video 和 audio 元素对本地离线存储的更好的支持新的特殊内容元素，比如 article、footer、header、nav、section新的表单控件，比如 calendar、date、time、email、url、search浏览器支持最新版本的 Safari、Chrome、Firefox 以及 Opera 支持某些 HTML5 特性。Internet Explorer 9 将支持某些 HTML5 特性。HTML5: 标签的改变HTML5 吸取了 XHTML 2 的一些建议，包括一些用来改善文档结构的功能，比如，新的 HTML 标签 header, footer, dialog, aside, fugure 等的使用，将使内容创作者更加语义地创建文档，之前的开发者在这些场合是一律使用 div 的。HTML5 还包含了一些将内容和展示分离的努力，开发者们也许会惊讶，b 和 i 标签依然存在，但它们的意义已经和之前有所不同，这些标签的意义只是为了将一段文字标识出来，而不是为了为它们设置粗体或斜体式样。u，font，center，strike 这些标签则被完全去掉了。新标准适用了一些全新的表单输入对象，包括日期，URL，Email 地址，其它的对象则增加了对非拉丁字符的支持。HTML5 还引入了微数据，一种使用机器可以识别的标签标注内容的方法，使语义 Web 的处理更为简单。总的来说，这些与结构有关的改进使内容创建者可以创建更干净，更容易管理的网页，这样的网页对搜索引擎，对读屏软件等更为友好。新应用程序接口（API）除了原先的DOM接口，HTML5增加了更多API,如：1. 用于即时2D绘图的Canvas标签2. 定时媒体回放3. 离线数据库存储4. 文档编辑5. 拖拽控制6. 浏览历史管理与HTML 4的不同之处新的解析顺序新的元素：section, video, progress, nav, meter, time, aside, canvasinput元素的新属性：日期和时间，email, url。新的通用属性：ping, charset, async全域属性：id, tabindex, repeat。移除元素：center, font, strike。HTML 5有两大特点:首先，强化了Web网页的表现性能。除了可描绘二维图形外，还准备了用于播放视频和音频的标签。其次，追加了本地数据库等Web应用的功能。异常处理HTML5(text/html)浏览器将在错误语法的处理上更加灵活。HTML5在设计时保证旧的浏览器能够安全的忽略掉新的HTML5代码。与HTML4.01相比，HTML5给出了解析的详细规则，力图让不同的浏览器即使在发生语法错误时也能返回相同的结果。HTML 5 正在改变 WebHTML5 是近十年来 Web 标准最巨大的飞跃。和以前的版本不同，HTML 5 并非仅仅用来表示 Web 内容，它的使命是将 Web 带入一个成熟的应用平台，在这个平台上，视频，音频，图象，动画，以及同电脑的交互都被标准化。尽管 HTML 5 的实现还有很长的路要走，但 HTML 5 正在改变 Web。HTML 最近的一次升级是1999年12月发布的 HTML 4.01。自那以后，发生了很多事。最初的浏览器战争已经结束，Netscape 灰飞烟灭，IE5 作为赢家后来又发展到 IE6, IE7。Mozilla Firefox 从 Netscape 的死灰中诞生，并跃居第二位。苹果和 Google 各自推出自己的浏览器，而小家碧玉的 Opera 仍然嘤嘤嗡嗡地活着，并以推动 Web 标准为己命。我们甚至在手机和游戏机上有了真正的 Web 体验，感谢 Opera，iPhone 以及 Google 已经推出的 Android。然而这一切，仅仅让 Web 标准运动变得更加混乱，HTML 5 和其它标准被束之高阁，结果，HTML 5 一直以来都是以草案的面目示人。于是，一些公司联合起来，成立了一个叫做 Web Hypertext Application Technology Working Group （Web 超文本应用技术工作组 - WHATWG） 的组织，他们将重新拣起 HTML 5。这个组织独立于 W3C，成员来自 Mozilla， KHTML/Webkit 项目组，Google，Apple，Opera 以及微软。尽管 HTML 5 草案不会在短期内获得认可，但 HTML 5 总算得以延续。HTML 5 将带来什么？以下是 HTML 5 草案中最激动人心的部分：全新的，更合理的 Tag，多媒体对象将不再全部绑定在 object 或 embed Tag 中，而是视频有视频的 Tag，音频有音频的 Tag。本地数据库。这个功能将内嵌一个本地的 SQL 数据库，以加速交互式搜索，缓存以及索引功能。同时，那些离线 Web 程序也将因此获益匪浅。不需要插件的富动画。Canvas 对象将给浏览器带来直接在上面绘制矢量图的能力，这意味着我们可以脱离 Flash 和 Silverlight，直接在浏览器中显示图形或动画。一些最新的浏览器，除了 IE，已经开始支持 Canvas。浏览器中的真正程序。将提供 API 实现浏览器内的编辑，拖放，以及各种图形用户界面的能力。内容修饰 Tag 将被剔除，而使用 CSS。理论上讲，HTML 5 是培育新 Web 标准的土壤，让各种设想在他的组织者之间分享，但 HTML 5 目前仍处于试验阶段。Mozilla 的技术副总裁 Mike Shaver 说，HTML 5 是一个被寄予厚望的概念，它既是 WHATWG 组织的实验田，又是 W3C 的标准之路。Shaver 认为，Mozilla 的兴趣和 WHATWG 实验相吻合，Mozilla 在 HTML 5 工作组中非常活跃，我们对一些早期的细则进行实验并将成熟的结果提交 W3C。在过去的几年，Mozilla 随着各种出现的新标准，推出多个富有前瞻性的项目，包括 Prism，一个用于离线运行 Web 程序的系统，以及 Weave，一个数据存储框架。Shaver 说，HTML 5 运动肇始于对 W3C 的不耐烦，Web 标准中的很多进展都因 W3C 将重点从 HTML 转移到 XML 而停滞不前。很多基于 XML 架构的新技术被设计出来替代 HTML，Shaver 说，这不是一条正确的道路，人们不应象黑瞎子掰玉米把样一边掰一边丢。HTML 5 的新实验在 Firefox 以及 基于 Webkit 的 Safari 和 Chrome 浏览器中逐渐得到强化，但仍有不少问题。Chrome 的开发者 Darin Fisher 说，Chrome 仍在襁褓中时，就不得不面临几个问题，尽管使用的是最新的 Webkit，HTML 5 的本地数据库功能在 Chrome 的初期版本中并没有实现。因为 Chrome 的沙箱机制和 Webkit 的数据库功能有冲突。而由于 Chrome 属于秘密开发，Chrome 的开发人员也不便参与 Webkit 的开发。我们要想保守 Chrome 的秘密，就无法参与 Webkit 社区。Fisher 说，我们很希望可以在某些方面给 Webkit 以帮助，我们拥有众多经验丰富的开发者，我们很想知道人们目前遇到的挑战并乐意提供帮助。随着 Chrome 的发布，Fisher 说他的团队成员有时会和 Webkit 的人一起吃饭，有些人私下里还成了好朋友。Fisher 称，他们迫切地想同其他 Webkit 开发组一起工作解决离线数据库的问题。Chrome 里面还包含Google 的开源 Gears 技术，用来实现与 HTML 5 类似的离线功能。Gears 可以看作已有 API 的替代品，Fisher 说，HTML 5 对新浏览器来说是非常好的东西，但绝大多数用户还使用旧浏览器。Gears 可以让那些旧浏览器也获得这样的 API，我们正在为 HTML 5 版 API 提供兼容。Gears 兼容性非常好，它正成为将 HTML 5 带向人们桌面的另外一条途径。目前，绝大多数工作由 Apple，Mozilla, Opera, Google 以及 Trolltech 展开。微软在干什么？IE 因其对 Web 标准的迟钝而闻名，更不要说 HTML 5。但 IE8 可能会做出改变。微软 IE 平台与 WHAT 工作组主席 Chris Wilson 在邮件中称，我们希望我们现在开始的工作可以在 HTML 工作组创建一套测试系统。Wilson 说，IE 开发组仍然对 HTML 5 的一些提议感到担忧。我觉得工作组的所有成员都会承认我们还有很多事要做。目前处于 Beta 版的 IE8，已经包含 HTML 5 的诸多新功能。它拥有一个跨文档消息系统，本地存储，以及一些离线事件来检测网络的中断。但还有些功能还未提上议程，如 Canvas。HTML 5 非常庞大，仍处在开发阶段，我认为浏览器厂商应当尽快达成一致，而每个浏览器的具体实现时间可以自己选择。Web 开发者和浏览器厂商会同意 Wilson 的下面这句话，这确切无疑是一个激动人心的时刻，我们希望看到 Web 成为新的应用平台。
html5的发展历程
标准通用标记语言下的一个应用HTML标准自1999年12月发布的HTML4.01后，后继的HTML5和其它标准被束之高阁，为了推动Web标准化运动的发展，一些公司联合起来，成立了一个叫做WebHypertextApplicationTechnologyWorkingGroup（Web超文本应用技术工作组-WHATWG）的组织。WHATWG致力于Web表单和应用程序，而W3C（WorldWideWebConsortium，万维网联盟）专注于XHTML2.0。在2006年，双方决定进行合作，来创建一个新版本的HTML。HTML5草案的前身名为WebApplications1.0，于2004年被WHATWG提出，于2007年被W3C接纳，并成立了新的HTML工作团队。HTML5的第一份正式草案已于2008年1月22日公布。HTML5仍处于完善之中。然而，大部分现代浏览器已经具备了某些HTML5支持。2012年12月17日，万维网联盟（W3C）正式宣布凝结了大量网络工作者心血的HTML5规范已经正式定稿。根据W3C的发言稿称：“HTML5是开放的Web网络平台的奠基石。”2013年5月6日，HTML5.1正式草案公布。该规范定义了第五次重大版本，第一次要修订万维网的核心语言：超文本标记语言（HTML）。在这个版本中，新功能不断推出，以帮助Web应用程序的作者，努力提高新元素互操作性。本次草案的发布，从2012年12月27日至今，进行了多达近百项的修改，包括HTML和XHTML的标签，相关的API、Canvas等，同时HTML5的图像img标签及svg也进行了改进，性能得到进一步提升。支持Html5的浏览器包括Firefox（火狐浏览器），IE9及其更高版本，Chrome（谷歌浏览器），Safari，Opera等；国内的遨游浏览器（Maxthon），以及基于IE或Chromium（Chrome的工程版或称实验版）所推出的360浏览器、搜狗浏览器、QQ浏览器、猎豹浏览器等国产浏览器同样具备支持HTML5的能力。在移动设备开发HTML5应用只有两种方法，要不就是全使用HTML5的语法，要不就是仅使用JavaScript引擎。JavaScript引擎的构建方法让制作手机网页游戏成为可能。由于界面层很复杂，已预订了一个UI工具包去使用。纯HTML5手机应用运行缓慢并错漏百出，但优化后的效果会好转。尽管不是很多人愿意去做这样的优化，但依然可以去尝试。HTML5手机应用的最大优势就是可以在网页上直接调试和修改。原先应用的开发人员可能需要花费非常大的力气才能达到HTML5的效果，不断地重复编码、调试和运行，这是首先得解决的一个问题。因此也有许多手机杂志客户端是基于HTML5标准，开发人员可以轻松调试修改。2014年10月29日，万维网联盟泪流满面地宣布，经过几乎8年的艰辛努力，HTML5标准规范终于最终制定完成了，并已公开发布。在此之前的几年时间里，已经有很多开发者陆续使用了HTML5的部分技术，Firefox、GoogleChrome、Opera、Safari4+、InternetExplorer9+都已支持HTML5，但直到今天，我们才看到“正式版”。HTML5将会取代1999年制定的HTML4.01、XHTML1.0标准，以期能在互联网应用迅速发展的时候，使网络标准达到符合当代的网络需求，为桌面和移动平台带来无缝衔接的丰富内容。W3CCEOJeffJaffe博士表示：“HTML5将推动Web进入新的时代。不久以前，Web还只是上网看一些基础文档，而如今，Web是一个极大丰富的平台。我们已经进入一个稳定阶段，每个人都可以按照标准行事，并且可用于所有浏览器。如果我们不能携起手来，就不会有统一的Web。”HTML5还有望成为梦想中的“开放Web平台”(OpenWebPlatform)的基石，如能实现可进一步推动更深入的跨平台Web应用。接下来，W3C将致力于开发用于实时通信、电子支付、应用开发等方面的标准规范，还会创建一系列的隐私、安全防护措施。W3C还曾在2012年透露说，计划在2016年底前发布HTML5.1。HTML5的设计目的是为了在移动设备上支持多媒体。新的语法特征被引进以支持这一点，如video、audio和canvas标记。HTML5还引进了新的功能，可以真正改变用户与文档的交互方式，包括：·新的解析规则增强了灵活性·新属性·淘汰过时的或冗余的属性·一个HTML5文档到另一个文档间的拖放功能·离线编辑·信息传递的增强·详细的解析规则·多用途互联网邮件扩展（MIME）和协议处理程序注册·在SQL数据库中存储数据的通用标准（WebSQL）HTML5在2007年被万维网联盟(W3C)新的工作组采用。这个工作组在2008年1月发布了HTML5的首个公开草案。眼下，HTML5处于“呼吁审查”状态，W3C预期它将在2014年年底达到其最终状态。语义特性（Class：Semantic）HTML5赋予网页更好的意义和结构。更加丰富的标签将随着对RDFa的，微数据与微格式等方面的支持，构建对程序、对用户都更有价值的数据驱动的Web。本地存储特性（Class:OFFLINE&STORAGE）基于HTML5开发的网页APP拥有更短的启动时间，更快的联网速度，这些全得益于HTML5APPCache，以及本地存储功能。IndexedDB（html5本地存储最重要的技术之一）和API说明文档。设备兼容特性(Class:DEVICEACCESS)连接特性（Class:CONNECTIVITY）更有效的连接工作效率，使得基于页面的实时聊天，更快速的网页游戏体验，更优化的在线交流得到了实现。HTML5拥有更有效的服务器推送技术，Server-SentEvent和WebSockets就是其中的两个特性，这两个特性能够帮助我们实现服务器将数据“推送”到客户端的功能。网页多媒体特性(Class:MULTIMEDIA)支持网页端的Audio、Video等多媒体功能，与网站自带的APPS，摄像头，影音功能相得益彰。三维、图形及特效特性（Class:3D,Graphics&Effects）基于SVG、Canvas、WebGL及CSS3的3D功能，用户会惊叹于在浏览器中，所呈现的惊人视觉效果。性能与集成特性（Class:Performance&Integration）没有用户会永远等待你的Loading——HTML5会通过XMLHttpRequest2等技术，解决以前的跨域等问题，帮助您的Web应用和网站在多样化的环境中更快速的工作。CSS3特性(Class:CSS3)1、取消了一些过时的HTML4标记其中包括纯粹显示效果的标记，如<font>和<center>，它们已经被CSS取代。HTML5吸取了XHTML2一些建议，包括一些用来改善文档结构的功能，比如，新的HTML标签header,footer,dialog,aside,figure等的使用，将使内容创作者更加语义地创建文档，之前的开发者在实现这些功能时一般都是使用div。2、将内容和展示分离b和i标签依然保留，但它们的意义已经和之前有所不同，这些标签的意义只是为了将一段文字标识出来，而不是为了为它们设置粗体或斜体式样。u，font，center，strike这些标签则被完全去掉了。3、一些全新的表单输入对象包括日期，URL，Email地址，其它的对象则增加了对非拉丁字符的支持。HTML5还引入了微数据，这一使用机器可以识别的标签标注内容的方法，使语义Web的处理更为简单。总的来说，这些与结构有关的改进使内容创建者可以创建更干净，更容易管理的网页，这样的网页对搜索引擎，对读屏软件等更为友好。4、全新的，更合理的Tag多媒体对象将不再全部绑定在object或embedTag中，而是视频有视频的Tag，音频有音频的Tag。5、本地数据库这个功能将内嵌一个本地的SQL数据库，以加速交互式搜索，缓存以及索引功能。同时，那些离线Web程序也将因此获益匪浅。不需要插件的丰富动画。6、Canvas对象将给浏览器带来直接在上面绘制矢量图的能力，这意味着用户可以脱离Flash和Silverlight，直接在浏览器中显示图形或动画。7、浏览器中的真正程序将提供API实现浏览器内的编辑，拖放，以及各种图形用户界面的能力。内容修饰Tag将被剔除，而使用CSS。8、Html5取代Flash在移动设备的地位。9、其突出的特点就是强化了web页的表现性,追加了本地数据库,HTML5和Canvas2D规范的制定已经完成，尽管还不能算是W3C标准，但是这些规范已经功能完整，企业和开发人员有了一个稳定的执行和规划目标。W3C首席执行官JeffJaffe表示：“从今天起，企业用户可以清楚地知道，他们能够在未来依赖HTML5。”HTML5是开放Web标准的基石，它是一个完整的编程环境，适用于跨平台应用程序、视频和动画、图形、风格、排版和其它数字内容发布工具、广泛的网络功能等等。为了减少浏览器碎片、实现于所有HTML工具的应用，W3C从今天开始着手W3C标准化的互操作性和测试。和之前宣布的规划一样，W3C计划在2014年完成HTML5标准。HTML工作组还发布了HTML5.1、HTMLCanvas2DContext、Level2以及主要元素的草案，让开发人员能提前预览下一轮标准。它可能会消灭Flash许多业内人士表示，HTML将会最终代替多媒体框架，如Adobe的Flash，但是短期看来还不是时候。HTML5估计到2014年才能逐步成熟，而且将现有应用Flash的网络开发完全转向HTML5还需要一段时间。尽管HTML5提出了许多优点，但是还可能有某些应用更适合于更灵活的框架。一些主流的大公司都逐步转向使用HTML5，谷歌于2015年2月26日开始自动将Flash广告转换为HTML5格式，这可能会加速HTML5替代Flash的进程，但是这个转变的过程也不是一蹴而就的。它新并不表示它安全网络应用开发工程师们在学习新技术的同时需要时刻记住网络安全。HTML5所构建的网页和其他语言编写的网页一样容易泄露一些敏感数据。欧洲网络信息安全机构（EuropeanNetworkandInformationSecurityAgency，ENISA）已经警告说HTML5可能并不够安全。它承诺带来一个无缝的网络HTML5会带来一个统一的网络，无论是笔记本，台式机，还是智能手机都应该很方便的浏览基于HTML5的网站。因此在设计网站的时候，开发者需要重新考虑用户体验，网站浏览，网站结构等因素使得这个网站对任何硬件设备都通用。它会变成企业的SaaS平台一些重量级的企业，如微软，Salesforce，SAPSybase正在开发HTML5的开发工具。如果你正在构建企业应用，很可能不久的将来你就要用到HTML5。所以当构建公司的SaaS战略迁移的时候也不要忘记HTML5。它将会变得很移动几乎所有人都热衷于开发独立的移动应用，但是HTML5很可能会是独立移动应用的终结者。由于HTML5将应用的功能直接加入其内核，这很可能引导移动技术潮流重新回到浏览器时代。HTML5允许开发者在（移动）浏览器内开发应用，所以如果你正在制定一项桌面或者移动应用的长期发展策略，你可能需要考虑这一点。2013年3月，HTML5标记语言的一个漏洞被发现：它允许网站利用数GB垃圾数据对用户展开轰炸，甚至会在短时间内将硬盘塞满。多款主流浏览器均会受此影响。一位名叫菲罗斯·阿伯克哈迪杰哈(FerossAboukhadijeh)的开发者率先发现了这一漏洞，他表示，多数主流网络浏览器均会受到影响，包括苹果Safari、谷歌Chrome、微软IE和Opera。唯一能够阻止数据大量加载的是Mozilla的火狐浏览器，该产品的数据存储上限为5MB。该问题的根源在于HTML5存储本地数据的方式。虽然每个浏览器都有不同的存储参数，但很多都支持用户自定义限制，且至少会在用户电脑上存储2.5MB数据。阿伯克哈迪杰哈发现了一个绕过数据上限的方法，它创建了多个与用户访问过的网站链接的临时网站。由于多数浏览器不会计算这种偶然情况，所以二级网站也可以存储与主网站相同量的数据。通过大批生成这种网站，该漏洞便可向受影响的电脑加载海量数据。在测试这一漏洞的过程中，阿伯克哈迪杰哈每16秒即可向他的固态硬盘版MacBookPro中加载1GB数据。他指出，Chrome等32位浏览器可能会在硬盘塞满前崩溃。“一些采用高明代码的网站其实已经取消了用户电脑对数据存储的限制。”阿伯克哈迪杰哈说。阿伯克哈迪杰哈已经发布一组代码来利用该漏洞，并创建了一个名为Filldisk的专用网站来凸显该漏洞的危害。网络标准HTML5本身是由W3C推荐出来的，它的开发是通过谷歌、苹果，诺基亚、中国移动等几百家公司一起酝酿的技术，这个技术最大的好处在于它是一个公开的技术。换句话说，每一个公开的标准都可以根据W3C的资料库找寻根源。另一方面，W3C通过的HTML5标准也就意味着每一个浏览器或每一个平台都会去实现。多设备跨平台用HTML5的优点主要在于，这个技术可以进行跨平台的使用。比如你开发了一款HTML5的游戏，你可以很轻易地移植到UC的开放平台、Opera的游戏中心、Facebook应用平台，甚至可以通过封装的技术发放到AppStore或GooglePlay上，所以它的跨平台性非常强大，这也是大多数人对HTML5有兴趣的主要原因。自适应网页设计很早就有人设想，能不能“一次设计，普遍适用”，让同一张网页自动适应不同大小的屏幕，根据屏幕宽度，自动调整布局（layout）。2010年，EthanMarcotte提出了”自适应网页设计“这个名词，指可以自动识别屏幕宽度、并做出相应调整的网页设计。这就解决了传统的一种局面——网站为不同的设备提供不同的网页，比如专门提供一个mobile版本，或者iPhone/iPad版本。这样做固然保证了效果，但是比较麻烦，同时要维护好几个版本，而且如果一个网站有多个portal（入口），会大大增加架构设计的复杂度。即时更新游戏客户端每次都要更新，很麻烦。可是更新HTML5游戏就好像更新页面一样，是马上的、即时的更新。总结概括HTML5有以下优点：1、提高可用性和改进用户的友好体验；2、有几个新的标签，这将有助于开发人员定义重要的内容；4、可以很好的替代FLASH和Silverlight；5、当涉及到网站的抓取和索引的时候，对于SEO很友好；6、将被大量应用于移动应用程序和游戏；7、可移植性好。缺点：该标准并未能很好的被浏览器所支持。因新标签的引入，各浏览器之间将缺少一种统一的数据描述格式，造成用户体验不佳。HTML5在诞生之后，就树立了一个原则，那就是所有的技术必须是开放的，不准有专利限制，在这期间Opera捐献了CSS技术，而Google则提供了视频格式WebM。可以说大部分的HTML协议在众多网络技术公司中达成共识，但在视频格式方面，世界各大互联网公司正在为具体标准进行争论，这可能影响HTML5标准的分流。纷争的两大阵营分别是Opera、火狐、Google等，另一大阵营则由苹果公司领衔。据统计2013年全球将有10亿手机浏览器支持HTML5，同时HTMLWeb开发者数量将达到200万。毫无疑问，HTML5将成为未来5-10年内，移动互联网领域的主宰者。据IDC的调查报告统计，截至2012年5月，有79%的移动开发商已经决定要在其应有程序中整合HTML5技术。12月，万维网联盟宣布已经完成对HTML5标准以及Canvas2D性能草案的制定，这就意味着开发人员将会有一个稳定的“计划和实施”目标。有很多的文章都在号召使用HTML5，并大力宣传它的好处。此前，站长之家曾经做过一期调查，调查显示只有36.16%的站长正在学习中，另外的63.76%表示正在观望中。作为站长，你是否准备开始学习HTML5？从性能角度来说，HTML5首先是缩减了HTML文档，使这件事情变得更简单。从用户可读性上说，原先一大堆东西对初学者来说，第一次看到这些东西是看不懂的，而HTML5的声明方式对用户来说显然更友好一些。1、移动优先从如今层出不穷的移动应用就知道，在这个智能手机和将平板电脑大爆炸的时代，移动优先已成趋势，不管是开发什么，都以移动为主。2、游戏开发者领衔“主演”许多游戏开发商都被Facebook或者Zynga推动着发展，而未来的Facebook应用生态系统是基于HTML5的，尽管在HTML5平台开发出游戏非常困难，但游戏开发商却都愿意那么做。通过PhoneGap及appmobi的XDK将Web应用游戏打包整合到原生应用中也是一种方式，Facebook差不多就这么干的——基于Web应用及浏览器，但却将之打包整合进原生应用。3、2014计划2012年9月，W3C提出计划要在2014年底前发布一个HTML5推荐标准，并在2016年底前发布HTML5.1推荐标准。第一个解决方案，现有的盈利模式可以移植到HTML5，今天游戏开发者通过跟苹果AppStore合作非常赚钱，其实HTML5的模式也可以通过封装把游戏放到AppStore一样的分成赚钱。第二个解决方案，HTML5游戏可以“傍着”平台，比方说Opera的游戏平台或其它浏览器的平台，以及所谓云游戏的游戏平台，都是新的盈利模式的平台。第三个解决方案，在谈到HTML5游戏与原生应用的表现性能比时，开发者需要考虑清楚要做的究竟是怎样一款游戏，HTML5更适合轻量级的小游戏。而且HTML5在代码保密性方面并不弱于原生应用。第四个解决方案，前面3个都是以HTML5游戏或者应用的形式为赢利点，其实任何技术形态最终都是一样，本质上都是服务于人（包含个人、企业），只要能满足需求的业务组合都是盈利的方向，例如目前催生的微信网站、HTML5营销、HTML5外包等，都是满足现实需求的盈利方案
jsp页面中怎样使用html5 audio标签播放音乐
<audio controls="controls" autoplay="autoplay" src="wxdsgsn.mp3"></audio>这么使用。
HTML5是什么意思
HTML5 是对 HTML 标准的第五次修订。其主要的目标是将互联网语义化，以便更好地被人类和机器阅读，并同时提供更好地支持各种媒体的嵌入。HTML5 的语法是向后兼容的。HTML5草案的前身名为 Web Applications 1.0，于04年被WHATWG提出，于07年被W3C接纳，并成立了新的 HTML 工作团队。HTML5手机应用的最大优势就是可以在网页上直接调试和修改。原先应用的开发人员可能需要花费非常大的力气才能达到HTML5的效果，不断地重复编码、调试和运行，这是首先得解决的一个问题。因此也有许多手机杂志客户端是基于HTML5标准，开发人员可以轻松调试修改。HTML5将会取代99年制定的HTML 4.01、XHTML 1.0标准，以期能在互联网应用迅速发展的时候，使网络标准达到符合当代的网络需求，为桌面和移动平台带来无缝衔接的丰富内容。HTML5的设计目的是为了在移动设备上支持多媒体。新的语法特征被引进以支持这一点，如video、audio和canvas 标记。HTML5还引进了新的功能，可以真正改变用户与文档的交互方式，包括：· 新的解析规则增强了灵活性· 新属性· 淘汰过时的或冗余的属性· 一个HTML5文档到另一个文档间的拖放功能· 离线编辑· 信息传递的增强· 详细的解析规则· 多用途互联网邮件扩展（MIME）和协议处理程序注册· 在SQL数据库中存储数据的通用标准（Web SQL）
HTML5是什么意思，网页设计？
关于HTML5的解释简要如下： 1、HTML5是HTML最新的修订版本，2014年10月由万维网联盟（W3C）完成标准制定。目标是取代1999年所制定的HTML 4.01和XHTML 1.0标准，以期能在互联网应用迅速发展的时候，使网络标准达到符合当代的网络需求。广义论及HTML5时，实际指的是包括HTML、CSS和JavaScript在内的一套技术组合。它希望能够减少网页浏览器对于需要插件的丰富性网络应用服务（Plug-in-Based Rich Internet Application，RIA），例如：Adobe Flash、Microsoft Silverlight与Oracle JavaFX的需求，并且提供更多能有效加强网络应用的标准集。 2、具体来说，HTML5添加了许多新的语法特征，其中包括<video>、<audio>和<canvas>元素，同时集成了SVG内容。这些元素是为了更容易的在网页中添加和处理多媒体和图片内容而添加的。其它新的元素如<section>、<article>、<header>和<nav>则是为了丰富文档的数据内容。新的属性的添加也是为了同样的目的。同时也有一些属性和元素被移除掉了。一些元素，像<a>、<cite>和<menu>被修改，重新定义或标准化了。同时APIs和DOM已经成为HTML5中的基础部分了。HTML5还定义了处理非法文档的具体细节，使得所有浏览器和客户端程序能够一致地处理语法错误，ITJOB。
4.html5表单属性wrap属性的作用效果？
HTML5表单中的wrap属性主要用在<textarea>多行文本框中来控制换行规则，具体属性说明见图：
HTML5开发小应用，小疑惑
支持Html5的浏览器包括Firefox（火狐浏览器），IE9及其更高版本，Chrome（谷歌浏览器），Safari，Opera等；国内的傲游浏览器（Maxthon），以及基于IE或Chromium（Chrome的工程版或称实验版）所推出的360浏览器、搜狗浏览器、QQ浏览器、猎豹浏览器等国产浏览器同样具备支持HTML5的能力。在移动设备开发HTML5应用只有两种方法，要不就是全使用HTML5的语法，要不就是仅使用JavaScript引擎。JavaScript引擎的构建方法让制作手机网页游戏成为可能。由于界面层很复杂，已预订了一个UI工具包去使用。纯HTML5手机应用运行缓慢并错漏百出，但优化后的效果会好转。尽管不是很多人愿意去做这样的优化，但依然可以去尝试。HTML5手机应用的最大优势就是可以在网页上直接调试和修改。原先应用的开发人员可能需要花费非常大的力气才能达到HTML5的效果，不断地重复编码、调试和运行，这是首先得解决的一个问题。因此也有许多手机杂志客户端是基于HTML5标准，开发人员可以轻松调试修改。HTML5的移植非常简单，但假设每个人都会让这变成一个自动化操作。许多业内人士表示，HTML将会最终代替多媒体框架，如Adobe的Flash，但是短期看来还不是时候。HTML5估计到2014年才能逐步成熟，而且将现有应用Flash的网络开发完全转向HTML5还需要一段时间。尽管HTML5提出了许多优点，但是还可能有某些应用更适合于更灵活的框架。一些主流的大公司都逐步转向使用HTML5，但是这个转变的过程也不是一蹴而就的。HTML5规范开发完成时，将成为主流。据统计2013年全球将有10亿手机浏览器支持HTML5，同时HTML Web开发者数量将达到200万。毫无疑问，HTML5将成为未来5-10年内，移动互联网领域的主宰者。据IDC的调查报告统计，截至2012年5月，有79%的移动开发商已经决定要在其应有程序中整 合HTML5技术。12月，万维网联盟宣布已经完成对HTML5标准以及Canvas 2D性能草案的制定，这就意味着开发人员将会有一个稳定的“计划和实施”目标。有很多的文章都在号召使用HTML5，并大力宣传它的的好处。此前，站长之家曾经做过一期调查，调查显示只有36.16%的站长正在学习中，另外的63.76%表示正在观望中。作为站长，你是否准备开始学习HTML5？从性能角度来说，HTML5首先是缩减了HTML文档，使这件事情变得更简单。第一，从用户可读性上说，原先一大堆东西，像初学者第一次看到这些东 西是看不懂的，而HTML5的声明方式对用户来说显然更友好一些。1、移动优先从如今层出不穷的移动应用就知道，在这个智能手机和将平板电脑大爆炸的时代，移动优先已成趋势，不管是开发什么，都以移动为主。2、游戏开发者领衔“主演”许多游戏开发商都被Facebook或者Zynga推动着发展，而未来的Facebook应用生态系统是基于HTML5的，尽管在HTML 5平台开发出游戏非常困难，但游戏开发商却都愿意那么做。通过PhoneGap及appmobi的XDK将Web应用游戏打包整合到原生应用中也是一种方式，Facebook差不多就这么干的——基于Web应用及浏览器，但却将之打包整合进原生应用。盈利方案第一个解决方案，现有的盈利模式可以移植到HTML5，今天游戏开发者通过跟苹果App Store合作非常赚钱，其实HTML5的模式也可以通过封装把游戏放到App Store一样的分成赚钱。第二个解决方案，HTML5游戏可以“傍着”平台，比方说Opera的游戏平台或其它浏览器的平台，以及所谓云游戏的游戏平台，都是新的盈利模式的平台。第三个解决方案，在谈到HTML5游戏与原生应用的表现性能比时，开发者需要考虑清楚要做的究竟是怎样一款游戏，HTML5更适合轻量级的小游戏。而且HTML5在代码保密性方面并不弱于原生应用。HTML5跟java和android个人觉得没什么联系，但是你有编程的基础，学HTML5还是很快的，HTML5不管是在PC还是安卓都可以运行的，楼主说的移植最多只是移植其他平台的游戏，
HTML5框架中除了Bootstrap，还有什么常用的？
1. Twitter BootStrap （Apache v2.0；响应式）时髦、直观并且强大的前端框架，让Web开发变得更加容易。2. Foundation （MIT；响应式）最先进的响应式前端框架。3. 960gs（GPL&MIT；响应式）960gs提供了一个简单的网格系统，适合快速开发。4. Skeleton（MIT；响应式）非常漂亮的Web模板，适合响应式、移动友好的开发。5. 99lime HTML KickStart（Free）适合网站快速开发的极简HTML构建模块。6. Kube（Free；响应式）面向专业人员的CSS框架。7. Less Framework（MIT；响应式）自适应的CSS网格系统。8. Flameinwork（Free）适合懒人开发者的前端微框架。9. G5 Framework（Free）(x)HTML5、CSS、PHP前端开发框架。10. Easy Framework（Free）Easy Framework是一个一体化前端解决方案，分structural、 presentational、interactive三层。11. Blueprint（Free）一个旨在减少开发时间的前端框架。12. YAML（Creative Commons）(x)HTML+CSS框架，适合开发现代化浮动布局。13. BlueTrip（Free）一个功能全面、并且美丽的CSS框架，适合于Blueprint搭配使用。14. YUI3:Grids CSS（BSD）YUI Grids CSS是最著名的CSS框架之一，是由Yahoo开发小组开发而成。 YUI Grids CSS为开发者提供了预先设置的四种不同页面宽度，六种不同的模板。15. 52framework（Creative Commons）对HTML5支持非常好，简单易用。16. elastiCSS（MIT）一个基于Web接口和印刷布局的简单CSS框架。17. Emastic（Free）一个与众不同的CSS框架。18. Fluid 960 Gride System（GPL/MIT）Fluid 960 Grid System的模版是根据Nathan Smith之前的作品而创建的。即960 Grid System：传承了MooTools和jQuery JavaScript libraries的效果。19. xCSS（MIT）一个面向对象的CSS框架，能让你的工作流更加简洁。xCSS基于CSS，可以在开发复杂样式时，提供面向对象的工作流。20. EM CSS Framework（MIT/GPL）EM CSS Framework提供了一个960px宽 + 12 列网格系统 + CSS的通用样式。
html5的audio如何获取currentTime的时间而且单位是毫秒
可以转换1s=1000ms
html5 视频currenttime设置失效，为什么自动变为0？
有可能是浏览器问题，我用Chrome也遇到了这个问题，换成IE就可以了。
HTML5 中 audio 的 duration 无法正常使用怎么办
#所有初始设置 $audio.onloadstart = -> buffer_interval = setInterval (-> setBufferProgress()),200 clearInterval(buffer_interval) if $audio.readyState > 0$audio.onloadedmetadata = -> #设置当前音量,默认0.8 $audio.volume = 0.8 default_volume_percentage = 100 * $audio.volume $current_volume.css height: default_volume_percentage + "%" $volume_point.css bottom: default_volume_percentage + "%" $duration.text(secondToTime($audio.duration))试试
如何制作简易的HTML5幻灯片
html5可以使用代码实现的简单幻灯片，并且能用鼠标滚轮滚动进行换页。具体代码如下：<!doctype html><html> <head> <title></title> <style> #slides{ position:absolute; left:0px; top:0px; height:100%; width:100%; overflow:hidden; } .slide{ position:absolute; height:600px; width:800px; opacity:0.7; background-color:rgba(0, 128, 196, 0.5) !important; background-color:#ccc; border-radius:10px; left:50%; top:50%; margin-top:-300px; box-shadow:5px 5px 5px rgba(0, 0, 0, 0.5); transition:all 0.25s ease-in-out 0s; } .current{ opacity:1; margin-left:-400px; } .future{ margin-left:450px; transform: skew(-3deg) scale(0.8); -webkit-transform: skew(-3deg) scale(0.8); } .post{ margin-left:-1250px; transform: skew(3deg) scale(0.8); -webkit-transform: skew(3deg) scale(0.8); } .far-future{ margin-left:1200px; transition:none; }</style></head><body><div id="slides"><div class="slide current">1</div><div class="slide future">2</div><div class="slide far-future">3</div><div class="slide far-future">4</div><div class="slide far-future">5</div><div class="slide far-future">6</div><div class="slide far-future">7</div></div><script> !function(){ var slides = document.getElementById("slides").childNodes;var l = slides.length; function fslide(e){ var event = e || window.event;//console.log(event.wheelDelta +" "+ event.detail); for(var i=0;i<l;i++){ if(slides[i].className=="slide current"){ var current_slide = slides[i]; break;}}//var current_slide = document.getElementsByClassName("current")[0];// getElementsByClassName只有火狐，谷歌等浏览器的较新版本支持if((event.wheelDelta < 0 /*ie,谷歌等浏览器*/ || event.detail > 0 /*firefox*/) && nextel(current_slide)){if(prevel(current_slide)){ prevel(current_slide).className="slide far-future"; }current_slide.className="slide post"; nextel(current_slide).className="slide current";if(nextel(nextel(current_slide))){ nextel(nextel(current_slide)).className="slide future"; } }else if((event.wheelDelta > 0 || event.detail < 0) && prevel(current_slide)){ if(nextel(current_slide)){ nextel(current_slide).className="slide far-future"; } current_slide.className="slide future"; prevel(current_slide).className="slide current"; if(prevel(prevel(current_slide))){ prevel(prevel(current_slide)).className="slide post" } } } document.onmousewheel = fslide; // ie,谷歌等浏览器 if(document.addEventListener){ document.addEventListener("DOMMouseScroll",fslide,false); // firefox } }(); function prevel(el){ if(el.previousSibling == null) return null; return el.previousSibling.nodeType == 1 ? el.previousSibling : prevel(el.previousSibling); } function nextel(el){ if(el.nextSibling == null) return null; return el.nextSibling.nodeType == 1 ? el.nextSibling : nextel(el.nextSibling); } </script> </body> </html>
HTML5怎么用高德地图API返回当前位置的经纬度
楼主好，开发问题需要您登录LBS创建工单咨询哦
HTML5 自动显示和隐藏文字，hidden属性，为何以下方法不能实现？
hidden属性在html5中，只要存在，就是隐藏效果，而不论值为多少，要显示元素，要删除hidden属性，而不是设置为false。实现代码如下：<script type=“text/javascript” async=“true”>function qq_onclick（）{var text_2=document.getElementById（“text_1”）；text_2、removeAttribute（“hidden”）；}function qq_close（）{var text_1=document.getElementById（“text_1”）；text_1、setAttribute（“hidden”，true）；}</script>扩展资料：HTML5的特性主要包括哪些内容随着移2113动互联网的飞速发展，5261目前Html5技术也得到了不断的完善，开4102发技术方面越来越成熟了，成为了1653目前主流的开发语言之一。html5的特性在五个方面体现的淋漓尽致1、语义特性：HTML5赋予网页更好的意义和结构。2、HTML5 APP Cache及本地存储：基于HTML5开发的网页APP拥有更短的启动时间，更快的联网速度3、设备兼容：HTML5提供了前所未有的数据与应用接入开放接口。使外部应用可以与浏览器内部的数据直接相连。4、连接特性：更有效的连接工作效率，使得基于页面的实时聊天，更快速的网页游戏体验，更优化的在线交流得到了实现。HTML5拥有更有效的服务器推送技术，能实现服务器将数据“推送”到web app的功能。5、图形特性：基于SVG、Canvas、WebGL及CSS3的3D功能，用户能在浏览器中得以体验到惊艳的视觉效果。
HTML5 自动显示和隐藏文字，hidden属性，为何以下方法不能实现？
hidden属性在html5中，只要存在，就是隐藏效果，而不论值为多少，要显示元素，要删除hidden属性，而不是设置为false。实现代码如下：<script type=“text/javascript” async=“true”>function qq_onclick（）{var text_2=document.getElementById（“text_1”）；text_2、removeAttribute（“hidden”）；}function qq_close（）{var text_1=document.getElementById（“text_1”）；text_1、setAttribute（“hidden”，true）；}</script>扩展资料：HTML5的特性主要包括哪些内容随着移2113动互联网的飞速发展，5261目前Html5技术也得到了不断的完善，开4102发技术方面越来越成熟了，成为了1653目前主流的开发语言之一。html5的特性在五个方面体现的淋漓尽致1、语义特性：HTML5赋予网页更好的意义和结构。2、HTML5 APP Cache及本地存储：基于HTML5开发的网页APP拥有更短的启动时间，更快的联网速度3、设备兼容：HTML5提供了前所未有的数据与应用接入开放接口。使外部应用可以与浏览器内部的数据直接相连。4、连接特性：更有效的连接工作效率，使得基于页面的实时聊天，更快速的网页游戏体验，更优化的在线交流得到了实现。HTML5拥有更有效的服务器推送技术，能实现服务器将数据“推送”到web app的功能。5、图形特性：基于SVG、Canvas、WebGL及CSS3的3D功能，用户能在浏览器中得以体验到惊艳的视觉效果。
html5 的flag是什么意思?
Html是英文HyperTextMarkupLanguage的缩写，中文意思是“超文本标志语言”，用它编写的文件(文档)的扩展名是.html或.htm，它们是可供浏览器解释浏览的文件格式。您可以使用记事本、写字板或FrontPageEditor等编辑工具来编写Html文件。Html语言使用标志对的方法编写文件，既简单又方便，它通常使用<标志名></标志名>来表示标志的开始和结束(例如<html></html>标志对)，因此在Html文档中这样的标志对都必须是成对使用的。%D%AHtml的基本标志： 1.<html></html> <html>标志用于Html文档的最前边，用来标识Html文档的开始。而</html>标志恰恰相反，它放在Html文档的最后边，用来标识Html文档的结束，两个标志必须一块使用。 2.<head></head> <head>和</head>构成Html文档的开头部分，在此标志对之间可以使用<title></title>、<script></script>等等标志对，这些标志对都是描述Html文档相关信息的标志对，<head></head>标志对之间的内容是不会在浏览器的框内显示出来的。两个标志必须一块使用。 3.<body></body> <body></body>是Html文档的主体部分，在此标志对之间可包含<p>、</p>、<h1>、</h1>、<br>、<hr>等等众多的标志，它们所定义的文本、图像等将会在浏览器的框内显示出来。两个标志必须一块使用。<body>标志中还可以有以下属性：属性 用途 示例 <bodybgcolor="#rrggbb">设置背景颜色。<bodybgcolor="red">红色背景 <bodytext="#rrggbb">设置文本颜色。<bodytext="#0000ff">蓝色文本 <bodylink="#rrggbb">设置链接颜色。<bodylink="blue">链接为蓝色 <bodyvlink="#rrggbb">设置已使用的链接的颜色。<bodyvlink="#ff0000"> <bodyalink="#rrggbb">设置正在被击中的链接的颜色。<bodyalink="yellow"> 说明:以上各个属性可以结合使用，如<bodybgcolor="red"text="#0000ff">。引号内的rrggbb是用六个十六进制数表示的RGB(即红、绿、蓝三色的组合)颜色，如#ff0000对应的是红色。此外，还可以使用Html语言所给定的常量名来表示颜色：Black、White、Green、Maroon、Olive、Navy、Purple、Gray、Yellow、Lime、Agua、Fuchsia、Silver、Red、Blue和Teal，如<bodytext="Blue">表示<body></body>标志对中的文本使用蓝色显示在浏览器的框内。 4.<title></title> 使用过浏览器的人可能都会注意到浏览器窗口最上边蓝色部分显示的文本信息，那些信息一般是网页的“主题”，要将您的网页的主题显示到浏览器的顶部其实很简单，只要在<title></title>标志对之间加入您要显示的文本即可。注意：<title></title>标志对只能放在<head></head>标志对之间。
html5的placeholder这个属性在获得焦点时怎样让默认的字体消失呢？
html5的placeholder这个属性就是获取焦点文字消失的啊
HTML5开发工具有哪些
1、SublimeTextSublimeText是一个跨平台的代码编辑器，同时支持Windows、Linux、MacOSX等操作系统，也是HTML和散文先进的文本编辑器。SublimeText具有漂亮的用户界面和强大的功能，主要功能包括:拼写检查，书签，完整的PythonAPI，Goto功能，即时项目切换，多选择，多窗口等等。2、DreamweaverDreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器，拥有可视化编辑界面，支持代码、拆分、设计、实时视图等多种方式来创作、编写和修改网页，初学HTML5的人可以无需编写任何代码就能快速创建Web页面。3、AdobeEdgeAdobeEdge是一款新型网页互动工具，允许设计师通过HTML5、CSS和Java制作网页动画。Edge的一个重要功能是Web工具包界面，方便确保页面在不同浏览器中的架构一致性。4、WebStormWebStorm是一款Java开发工具，目前已经被广大中国JS开发者誉为"Web前端开发神器"、"最强大的HTML5编辑器"、"最智能的JavaIDE"等。WebStorm具有的优势是：智能的代码补全、代码格式化、html提示、联想查询、代码重构、代码检查和快速修复、代码调试、代码结构浏览、代码折叠、包裹或者去掉外围代码。5、HBuilderHBuilder，即HtmlBuilder的缩写，Builder是建造者的意思。HBuilder是一个极客工具，追求无鼠标的极速操作，不管是敲代码的快捷设定，还是操作功能的快捷设定，都融入了效率第一的设计思想。HBuilder不为敲字母而花费时间，不为大小写拼错而调错半天，把精力花在思考上，想清楚后落笔如飞。支撑这个理念，除了体验上的精细设计，还要求我们突破很多世界级技术难题，包括语法库、语法结构模型、AST语法分析引擎。参考资料来源：百度百科——SublimeText参考资料来源：百度百科——Dreamweaver参考资料来源：百度百科——AdobeEdge参考资料来源：百度百科——WebStorm参考资料来源：百度百科——HBuilder
HTML5开发工具有哪些？
一、AdobeEdge目前还处于预览阶段的AdobeEdge是用HTML5、CSS、JavaScript开发动态互动内容的设计工具。内容可以同时兼容移动设备和桌面电脑。Edge的一个重要功能是Web工具包界面，方便确保页面在不同浏览器中的架构一致性，此外Edge还将整合TypeKit这样的字体服务。动画和图形可以添加到HTML元素中，程序也能通过Edge自身的代码片段库或者JavaScript代码进行扩展。动画可以在独立的时间线上进行嵌套，还能实现互动功能。符合可以服用并通过API和代码片段控制。通过Edge设计的内容可以兼容iOS和Android设备，也可以运行在火狐、Chrome、Safari和IE9等主流浏览器。二、AdobeDreamweaverCS6AdobeDreamweaverCS6作为一个Web设计软件，提供了对HTML网站和移动程序的可视化编辑界面。其FluidGrid排版系统整合CSS样式表功能，提供自适应版面的跨平台兼容性。开发者可以完全实现Web设计的可视化操作，无需为代码所困。用户不但还能在LiveView中预览，还提供多屏幕预览功能。开发者可以通过MultiScreen预览面板查看HTML5内容的渲染效果。LiveView通过WebKit渲染引擎支持HTML5。三、AdobeColdFusion10ColdFusion是用来开发企业Web程序的服务器端技术，通过Websockets、互动表单、视频和地理标签等HTML5技术创建富媒体用户体验。四、SenchaArchitect2在开发移动和桌面应用的工具中，Sencha的定位是HTML5可视化应用开发。开发团队可以在一个单一集成的环境中完成应用的设计、开发和部署。开发者还可以开发SenchaTouch2和ExtJS4JavaScript应用，并实时预览。五、SenchaTouch2SenchaTouch2是移动应用框架，也被看作是Sencha的HTML5平台。开发者可以用它开发面向iOS、Android和Blackberry、KindleFire等多种平台的移动应用。六、DojoFoundationMaqetta来自于IBM的一个项目，DojoFoundationMaqetta是为桌面和移动设备开发HTML5应用的开源工具，支持在浏览器中查看HTML5界面。用户体验设计师可以通过拖放组装UI样板七、微软VisualStudio2010ServicePack1虽然一开始并不支持HTML5，但微软在2011年三月发布的VisualStudio2010SP1中提供了IntelliSense，追加了针对HTML5的一些元素。八、JetBrainsWebStorm4.0作为拥有HTML编辑器的JavaScript集成开发环境，WebStorm4.0提供了开发web应用的HTML5样板。开发者可以在创建HTML文档时可获得对HTML5文件的支持。例如砍伐者键入。开发者还可以在chrome浏览器中实时预览HTML文档。九、GoogleWebToolkit该开发工具用于开发浏览器应用，但库中支持很多HTML5功能。包括对客户端或web存储的支持。其他HTML5功能还包括支持Canvas可视化，以及音频和视频widget。
html5常用的开发工具是哪些？
有很多：Dreamweaver，Visual Studio，Aptana，Notepad++等等，不过我一直用的Visual Studio，用法很简单，需要知道的话，请追问，毕竟你没问怎么用。
如何用Adobe Edge做一个最简单的HTML5动画
以下就以做一个最简单的方块动画来说明基本用法： 1. 使用方块工具在stage上画一个方块, 顺便将前景色选为蓝色 2. 我们目标是让方块移动到右下角, 在移动过程中改变它的透明度 和 旋转角度 所以我们先要对这几个参数建立关键帧 右击方块, 在弹出菜单中选择 Add Keyframe - Opacity3. 然后我们在下方的Timeline面板中将初始的透明度修改为204. 然后我们将右边的时间浮标拖动到一个随意的时间点, 点击透明度修改框右边的小按钮, 再次创建一个关键帧 5. 创建完第二个关键帧后, 我们再对透明度进行修改, 改为100 此时能够发现在两个时间点的关键帧直接出现了淡黄色填充条, 代表这里已经存在一个变化的过程了, 我们此时可以点击Play按钮试一下 6. 如法炮制, 我们可以再添加一个旋转的动画, 只要右击选择Add Keyframe- Rotate (或者直接在左边修改Rotate值也可以) 注意一定要保证你运行动画的两端时间点都有关键帧, 关键帧通过点击属性修改框右边的菱形按钮添加 7. 此时应该可以运行2个动画了, 按play键试试呗~ 接下来我们可以对这个矩形再添加一个简单的事件, 比如鼠标单击时使动画回放 我们需要在右上角的Elements菜单中找到Rectangle, 点击左边的Open Actions添加事件处理程序 8. 选择Click事件 9. 在代码编辑框中选择右边的Play Reverse选项添加回放的功能. (当然你也可以自己编写自己的代码) 10. 编辑完毕后直接关闭即可, 由于在编辑窗口中无法直接响应点击事件, 我们需要保存为HTML文件在浏览器中进行试验 点击左上角File-Save as 保存为HTML文件 11. 我们可以发现它生成了好多JS文件 其中edge_includes文件夹中存放了JQuery库的文件以及Edge的共用JS库文件 其余js文件则是当前页面所需要的js文件12. 直接用支持HTML5的浏览器打开HTML文件, 就可以看到效果啦~！
webstorm新建html5文件时 下拉列表里没有html5的选项怎么办
html5和普通的html文件没有差别，所以你可以选择html文件，然后把其头部修改为html5标准头即可（当前页面即是html5标准头）
windows下做html5开发用什么工具？
工具/原料AdobeDreamweaverCS6AdobeEdgeDevExtremeJetBrainsWebStormSenchaArchitectInitializrHTML5demosHTML5TrackerHTML5visualcheatsheetSwitchToHTML5HTML5TestLimeJS12款程序员必备的HTML5开发工具方法/步骤1:1.AdobeDreamweaverCS6DreamweaverCS6是世界顶级软件厂商Adobe推出的一套拥有可视化编辑界面，用于制作并编辑网站和移动应用程序的网页设计软件。由于Dreamweaver支持代码、拆分、设计、实时视图等多种方式来创作、编写和修改网页，对于初级人员，你可以无需编写任何代码就能快速创建Web页面。其成熟的代码编辑工具更适用于Web开发高级人员的创作！方法/步骤2:2.AdobeEdgeAdobeEdge是一个用HTML5、CSS、Java开发动态互动内容的设计工具。它的一个重要功能是web工具包界面，用于方便确保在不同浏览器中架构的一致性，此外，AdobeEdge还将整合TypeKit这样的字体服务。通过Edge设计的内容可以兼容iOS和Android设备，也可以运行在火狐、Chrome、Safari和IE9等主流浏览器上。方法/步骤3:3.DevExtremeDevExtremeCompleteSubion是性能最优的HTML5,CSS和Java移动开发框架，可以直接在VisualStudio集成开发环境，构建iOS，Android，Tizen和WindowsPhone8应用程序。DevExtreme包含PhoneJS和ChartJS两个原生UI组件，并且提供源代码。目前，DevExtreme支持VS2010/2012/2013集成开发环境，兼容Android4+、iOS5+、Windows8、WindowPhone8、Tizen五大移动平台，是VisualStudio开发人员开发跨平台移动产品的首选工具。方法/步骤4:4.JetBrainsWebStormWebStorm是jetbrains公司旗下一款JavaScript开发工具。被广大中国JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaSIDE”等。与IntelliJIDEA同源，继承了IntelliJIDEA强大的JS部分的功能。方法/步骤5:5.SenchaArchitect在开发移动和桌面应用的工具中，Sencha的定位是HTML5可视化应用开发。开发团队可以在一个单一集成的环境中完成应用的设计、开发和部署。开发者还可以开发SenchaTouch2和ExtJS4Java应用，并实时预览。方法/步骤6:6、InitializrInitializr是制作HTML5网站最好的入门辅助开发工具，你可以使用提供的特色模板快速生成网站，也可以自定义，Initializr会为你生成代码简洁的可定制的网页模板。方法/步骤7:7、HTML5demos想知道你的浏览器是否支持HTML5Canvas吗？想知道Safari是否可以运行简单的HTML5聊天客户端吗？HTML5demos会告诉你每一个HTML5特性在哪些浏览器中支持。方法/步骤8:8、HTML5Tracker想了解HTML5的最新动向吗?使用HTML5Tracker吧，它可以跟踪HTML5最新修订信息。方法/步骤9:9、HTML5visualcheatsheet想要快速超找一个标签或者属性吗？看看这个非常酷的速查手册吧，每个Web开发人员的必备。方法/步骤10:10、SwitchToHTML5SwitchToHTML5是一个基础而实用的模板生成工具。如果你开始一个新项目，可以到这里获取免费的HTML5网站模板。方法/步骤11:11、HTML5Test你浏览器准备好迎接HTML5革命了吗？HTML5Test将告诉你。这个网站会为你当前使用的浏览器生成一份对video、audio、canvas等等特性的支持情况的完整报告。方法/步骤12:12、LimeJSLimeJS是一个HTML5游戏开发框架，用于快速构建运行于触屏设备和桌面浏览器的游戏。非常棒的HTML5开发工具，一定要用用试试。
html5用什么来代替 marquee制作滚动字幕呢？
使用css3，具体查询css3动画
如何用FineReport开发html5图表
1准备数据在制作图表前，需要先定义图表的数据来源。在上面的图表制作流程中提到数据来源有两种类型，数据集数据源和单元格数据源，本章节使用数据集作为数据源，如果需要使用单元格数据源，可查看定义图表单元格数据源。新建工作薄，添加数据集，SQL语句为SELECT * FROM [销量]，使用销量表作为图表的数据来源。2插入图表并选择图表类型图表有两种插入方式：单元格图表与悬浮图表，该例中我们以悬浮图表为例，单元格图表的插入方式请查看单元格图表。点击工具栏中的插入>悬浮元素>插入图表，弹出图表向导，选择图表类型如柱形图，如下图：注：插入图表和选择图表类型一般性是在一起完成的。定义图表数据选择完图表类型后，点击确定，返回报表主体界面，选中悬浮图表，在报表主体右侧上方的图表属性表中设置图表属性，选择图表属性表-数据，设置柱形图的数据，如下图：设置图表数据，首先要选择数据来源，前面我们新建了一个数据集ds1，这张图表的数据来源于数据集数据，选择好数据来源之后，为分类轴、系列名、系列值绑定数据集中的字段，用图表来展示数据集中的数据。分类轴：就是图表的横轴，即x轴，表示数据是按照什么分类显示的；系列名：系列就是图表的纵轴，即y轴，系列名称表示每个分类下数据是按照什么顺序显示的；系列值：就是每个系列的值；汇总方式：对系列值的计算方式。图表样式设置标题设置选中图表，在设计器右侧上方会出现图表属性表，选择图表属性表-样式>标题，增加图表标题系列标签设置选择图表属性表-样式>标签，勾选标签，显示出每个系列的值：保存模板
什么是云游戏和HTML5云游戏！
是一种以云计算技术为基础的在线游戏技术。云游戏技术使图形处理与数据运算能力相对有限的轻端设备(thin client)能运行高品质游戏 就现今来说,云游戏还并没有成为家用机和掌机界的联网模式。如果这种构想能够成为现实,那么主机厂商将变成网络运营商,他们不需要不断投入巨额的新主机研发费用,而只需要拿这笔钱中的很小一部分去升级自己的服务器就行了,但是达到的效果却是相差无几的。对于用户来说,他们可以省下购买主机的开支,但是得到的确是顶尖的游戏画面(当然对于视频输出方面的硬件必须过硬)。你可以想象一台掌机和一台家用机拥有同样的画面,家用机和我们用的机顶盒一样简单,甚至家用机可以取代电视的机顶盒而成为次时代的电视收看方式
html5的头文件里该怎么写头文件
header 就跟一般的 div 一样用法，只是规范通常是放在上面，footer 则是放在下面里面要放什么基本上都行，不懂可以私信问我详细
html5 如何固定 header
神马叫做固定header？
html5中标签和标签有什么区别
<header>是标示性标签，是HTML5新添加的标签；<header>标签与<div id="header">是一样的，只是由于<header>是新标签，老浏览器不识别。<head>是html框架中的标签例如：<html><head>...</head><body>...</body><html>
html5 跨屏前端框架有哪些
Html5框架在当下火热程度不减，越来越多的人都在学习从事html5开发。前端html5框架有哪些？小编推荐五款国内较火的HTML5前端开发框架，它们分别是腾讯团队开发的JX、淘宝团队开发的KISSY、百度团队开发的QWrap和Tangram，以及上海康尚实验室推出的Como。1. JX（腾讯），腾讯团队打造的前端开发框架JXJX 是一个类似 Google Closure Library 的 Web 前端开发框架，服役于 WebQQ 等大规模的 WebApp。JX 是模块化的非侵入式Web前端框架，开发于2008年，并于2009年开源于GoogleCode ，于2012年切换到Github。 JX 框架同时适用于 Web Page 和 Web App 项目的开发，特别适合构建和组织大规模、工业级的Web App，腾讯 WebQQ、腾讯Q+等产品都是采用JX框架开发，兼容目前所有主流浏览器。2. KISSY（淘宝）KISSY是淘宝的前端类库，几乎在淘宝的每个页面上都能看到它的身影。KISSY提供稳定的核心，包括 oo、dom、Event、Anim、Ajax 等；强大且易用的脚本加载器，特有的 loader；丰富的UI组件，包括 Switchable、Overlay、Draggable and Droppable 等。KISSY具备模块化、高扩展性、组件齐全等特性。3. QWrap（百度）QWrap是百度有啊前端团队推出的一个Javascript框架，支持IE6+、Firefox、Chrome、Safari、Opera等浏览器，在BSD协议下开源发布。QWrap的特点如下：1. 提供jQuery一样方便的dom功能，同时又打破jQuery“专注于dom”的约束，也提供非dom的许多功能。2. 提供prototype方便的原型功能，同时又提供Javascript1.6的泛型功能，并且提供用户有选择方便与严谨的自由。3. 提供YUI2一样的静态方法库，同时又用所谓的Helper规范来做到真正的绝对静态，让组件开发者可以发布出无依赖的组件。4. 学习YUI3的use，同时又摈弃YUI3的严谨性洁癖，让use更实用。5. QWrap独创特的Helper + Wrap + Retouch + Apps设计，让QWrap有更多的灵性等待你去发现。4. Tangram（百度）Tangram是一款实用的JavaScript基础库，通过它可以快速构建出高度互动的Web应用程序。Tangram具有全浏览器兼容，平滑升级体验以及自由定制输出较小尺寸的特点。5. Como（康尚实验室）Como JS，Como由上海康尚实验室开发，是一款简易而功能强大的JS框架，对String等原生对象进行了扩展，支持常用的CSS选择器，高效的动画播放，强大的，包扩展机制，支持类的继承等。
如何处理html5新标签的浏览器兼容问题
HTML5已形成了最终的标准，概括来讲，它主要是关于图像，位置，存储，多任务等功能的增加。新增的元素有绘画 canvas ，用于媒介回放的 video 和 audio 元素，本地离线存储 localStorage 长期存储数据，浏览器关闭后数据不丢失，而sessionStorage的数据在浏览器关闭后自动删除，此外，还新增了以下的几大类元素。内容元素，article、footer、header、nav、section。表单控件，calendar、date、time、email、url、search。控件元素，webworker, websockt, Geolocation。移出的元素有下列这些：显现层元素：basefont，big，center，font, s，strike，tt，u。性能较差元素：frame，frameset，noframes。处理兼容问题有两种方式：1.IE8/IE7/IE6支持通过document.方法产生的标签，利用这一特性让这些浏览器支持HTML5新标签。2.使用是html5shim框架另外，DOCTYPE声明的方式是区分HTML和HTML5标志的一个重要因素，此外，还可以根据新增的结构、功能元素来加以区分。
HTML5开发-如何实现两个div的重叠
在很多情况下都需要实现两个div的重叠（包含层级关系），实现的方法也和div中属性设置的不同也是不一样的，尤其是 position 和 display 的变化. 但是总体上就是对margin（ 盒模型 ）和top（ 定位 ）等的运用。margin是属于盒模型中的一部分，修改了margin，就是修改了div元素的大小，但是修改了定位，只是修改了 自己本身的位置 ，不修改元素占用的大小，也不会干扰其他元素的位置。 1. 但是依靠margin来重叠有很大的 局限性 ，图片如下： 这是设置了 黄色div块的margin-top 才实现的，你也可以设置 蓝色div的margin-bottom。 如果你设置黄色div的margin-bottom就不能实现重叠的效果。 2. 当两个div的position为 relative 时，可以同时使用盒模型和定位来实现重叠。使用定位来选择位置时，优先级为top>bottom，left>right，优先级高的会屏蔽低的。 3. 当两个div的position为 absolute 时，那么父元素必须设置一个 定位 属性（不能为默认的static），这样子div才能相对于父div布局。
html5怎么设置网页过渡效果
在web设计中使用js可以实现很多的页面特效，然而很多人却忽视了HTML标签中META标签的强大功效，其实meta标签也可以实现很多漂亮的页面过渡效果。 META标签是HTML语言HEAD区的一个辅助性标签，Meta 标签放在每个网页的<head>...</head> 中间，我们大家比较熟悉的如： <meta name="GENERATOR" content="Microsoft FrontPage 3.0">//说明编辑工具； <meta name="KEYWORDS" content="...">//说明关键词； <meta name="DESCRIPTION" content="...">//说明主页描述； 它提供用户不可见的信息。meta标签通常用来为搜索引擎robots定义页面主题，或者是定义用户浏览器上的cookie；它可以用于鉴别作者，设定页面格式，标注内容提要和关键字；还可以设置页面使其可以 根据你定义的时间间隔刷新自己,以及设置RASC内容等级，等等 用法：<Meta http-equiv="Page-Enter" Content="blendTrans(Duration=0.5)"> <Meta http-equiv="Page-Exit" Content="blendTrans(Duration=0.5)"> blendTrans是css动态滤镜的一种，产生渐隐效果。另一种动态滤镜RevealTrans也可以用于页面进入与退出效果: 动态滤镜可以为页面添加动人的淡入淡出、图象转化效果，它可以分为两种blend（混合）和reveal（显示）， 前者可以使对象渐渐消失或出现，后者提供了24种图象转化的效果...... <Meta http-equiv="Page-Enter" Content="revealTrans(duration=x, transition=y)"> <Meta http-equiv="Page-Exit" Content="revealTrans(duration=x, transition=y)"> Duration:表示滤镜特效的持续时间(单位：秒) Transition:滤镜类型。表示使用哪种特效，取值为0-23。
HTML5 的 hidden="hidden" 和CSS的 display:none有什么区别
没区别，都是隐藏，而且原有位置不保留css中还有一个属性叫visibility:hidden，这个是内容隐藏，位置保留
HTML5中“style=“display:none””的作用
把该元素隐藏掉，而且移除dom中占的位置，会对其他元素的位置产生影响，区别于" visibility: hidden;"，这个也是隐藏，但是会在页面占据原本的位置。
请问HTML5中drag&drop触发事件有哪些？能否简单的介绍一下？
在拖动和拖放过程中会涉及到两个对象，一个是被拖动的drag对象，一个是drop对象（拖放容器对象）。 在拖动和拖放这一过程中会发生七大事件。下面是对这七大事件的简单介绍：事件名称 作用对象 作用对象 Dragstar事件 被拖动的drag对象。 当对象开始拖动时触发。Drag事件 被拖动的drag对象。 在Drag对象被拖动期间连续触发。Dragend事件 被拖动的drag对象。 在Drag对象拖动到Drop目标对象上时被触发。Dragenter事件 drop对象 在Drag对象拖动到Drop目标对象边界时触发。Dragover事件 drop对象 当Drag对象在Drop目标对象上移动时触发，且会反复的触发该事件。Dragleave事件 drop对象 Dragleave事件在这个拖动对象离开Drop目标对象的范围时触发。Drop事件 drop对象 当这个Drag对象在Drop对象上释放鼠标时触发这些是HTML5的新特性，可以在秒秒学查找相关的资料。
Html5和Javascript是什么关系
HTML5是用于建立网页基本框架的JavaScript是用来跟用户交互以及实现动态效果的
怎样将HTML5 web应用变成android应用
您好，我来为您解答： 一、Android SDK中的WebView 二、使用PhoneGap 三、使用Rexsee在线生成 希望我的回答对你有帮助。
面向移动设备的html5开发框架 哪个最好
很久以前整理了篇将手机网站做成手机应用的JS框架。时隔一年多，很多新的技术已经出现，下面再来总结下还有哪些框架是适合面向手机设备的开发的。 1、jQuery Mobile jQuery Mobile 是 jQuery 在手机上和平板设备上的版本。jQuery Mobile 不仅会给主流移动平台带来jQuery核心库，而且会发布一个完整统一的jQuery移动UI框架。支持全球主流的移动平台。jQuery Mobile开发团队说：能开发这个项目，我们非常兴奋。移动Web太需要一个跨浏览器的框架，让开发人员开发出真正的移动Web网站。 2、jQTouch jQTouch 是一个 jQuery 的插件，主要用于手机上的 Webkit 浏览器上实现一些包括动画、列表导航、默认应用样式等各种常见UI效果的 JavaScript 库。支持包括 iPhone、Android 等手机。 3、DHTMLX Touch DHTMLX Touch是一个免费的HTML5/JavaScript框架，专门为触摸屏设备而优化。为您带来快速开发工艺精美的移动Web应用程序的能力。DHTMLX Touch UI Designer是一个可视化的编辑器用于构建移动用户界面。它能够帮您以最少的编码构建一流的用户界面。在其主页上提供一些示例可以展示DHTMLX Touch强大的用户界面。包括一个menu app for the iPad (适用于开发餐厅应用) 和Book Shop (一个电子书店应用)。 4、Mobilize.js Mobilize.js是一个开源的HTML5-JavaScript框架用于从任何现在有标准网站快速，简便地构建移动网站。这个框架其实就是将需要在移动设备上显示的部分页面以jQuery Mobile的默认主题显示，而不是实现一个全新完整的移动页面。Mobilize.js 可用于任意网站，但对于基于WordPress和Sphinx的网站不需要使用该框架转换，因为已经有非常多的插件可以使用。 5、The M Project The-M-Project是另外一个强大的JavaScript框架，它利用HTML5新的特性来更好和更简便地开发移动应用。这个框架遵循著名的MVC软件架构模式。它还支持离线，所以你的用户可以在没有连接网络的情况下继续操作(当下次有连线的时候，再将数据同步到服务器中)。提供优秀的文档(这个项目拥有一个引导新用户入门的开发指南)。可以查看提供的示例来对该项目有一个初目的了解。这些示例包括：ToDo App(待办事项目应用) 和 KitchenSink (这个示例包括这个框架提供的所有UI元素)。 6、WebApp.Net WebApp.Net 提供了很多的 API，因此可以帮助你节省很多工作了。不需要花时间去进行 Ajax 调用的编码，因为已经内置了，另外还有很多其它内置功能，提供了详细的文档和应用演示。 7、Wijmo Wijmo是一个基于jQuery UI的UI部件的套件。Wijmo部件进行了优化客户端Web开发和利用jQuery的优越的性能和易用性的力量。所有的Wijmo部件都配备了20多个主题和支持ThemeRoller。 8、960 Grid on jQuery-Mobile jquery-mobile-960 是一个用于移动 Web 开发的网格框架，综合了 960.gs 的灵活性和 jQuery Mobile 的方便性。它的目的是让 jQuery Mobile 布局更加的灵活，使得应用应许在移动终端更加易用。 9、Sencha Touch Framework Sencha Touch 是世界上第一个基于 HTML5 的移动 Web 开发框架，支持最新的 HTML5 和 CSS3 标准，全面兼容 Android 和 Apple iOS 设备，提供了丰富的 WEB UI 组件，可以快速的开发出运行于移动终端的应用程序。Shencha是第一个使用HTML5，CSS和JavaScript并且支持音频/视频，本地存储，圆角，渐变背景以及阴影的开发框架。 10、NimbleKit NimbleKit 是为 iOS 设备构建应用程序最快速的方式，你不需要知道 Objective-C 或者 iOS SDK，你只需结合 JavaScript 代码编写 HTML 页面就可以了。 11、Touchyu2122 Boilerplate Touchy Boilerplate 是一个用来创建移动web app，包括HTML模板，Meta tag等的工具。Touchy可以支持动态页面导航，固定页头，滚动内容，浏览历史记录等功能。Touchy使用jQuery或者 Zepto.JS。 12、PhoneGap PhoneGap是一个用基于HTML，CSS和JavaScript的，创建移动跨平台移动应用程序的快速开发平台。它使开发者能够利用iPhone，Android，Palm，Symbian,WP7,Bada和Blackberry智能手机的核心功能——包括地理定位，加速器，联系人，声音和振动等，此外PhoneGap拥有丰富的插件，可以以此扩展无限的功能。PhoneGap是免费的，但是它需要特定平台提供的附加软件，例如iPhone的iPhone SDK，Android的Android SDK等，也可以和DW5.5配套开发。使用PhoneGap只比为每个平台分别建立应用程序好一点点，因为虽然基本代码是一样的，但是你仍然需要为每个平台分别编译应用程序。 13、joshfire Joshfire是一个开源的跨设备开发框架，帮助开发者创建可以在多种设备上运行的web app。它使用HTML5和JavaScript，并且允许开发者快速整合本地应用和特定的web应用。Joshfire可以让你的应用接受键盘，鼠标，触摸屏，遥控器等设备的输入。Joshfire支持Node.JS。4.Sencha Touch：基于HTML5的移动网页开发框架。 14、 Julia Julia框架由基本CSS3文件、JS库和各个平台的运行库构成。不像PhoneGap，Julia不仅仅包含调用本机代码的接口层，它还包含 Model-View-Controller(MVC)支持，Delegation支持，OAuth支持，异步数据库存取接口，HTML选择符(类jQuery调用接口)，HTML模版(允 许嵌入JS代码)等应用开发必备的API接口。 基于Julia的应用开发就像网站开发那么简单，是的，你终于可以用HTML5开发一个完整的、跨平台 的、不亚于本机代码的、易于维护的移动应用了！大幕即将揭晓，让我们一起进入移动开发的新时代 15、SproutCore HTML5 Application Framework SproutCore 是一个 HTML5 移动 Web 开发框架，它的目标是在无需浏览器插件的情况下，在浏览器中位应用程序提供极佳的桌面效果。 16、Titanium 这是一个强大的，健壮的移动Web开发框架。能够让使用现有的HTML, CSS和JavaScript知识来为 iOS和Android平台开发原生移动应用。作为一个越来越大的移动Web框架，它拥有超过300个的APIs和活跃的开发者社区。你从这个社区中得到每一个开发人员的帮助。Titanium Mobile支持原生的iOS和Android UI元素如Table views, tabs, switches和popovers。它提供能够与移动设备的摄像头和本地文件存储系统相交互的特性。 17、Lungo.js Lungo.js 是一个采用HTML5, CSS3 和JavaScript技术实现的移动Web应用程序开发框架。利用这框架开发的应用程序可运行所有流行的平台包括：iOS, Android, Blackberry 和 WebOs。它还支持触摸事件如：tap, double-tap和swipe。整个框架没有用到任何图片包括图标，所有都矢量化。可以在这个框架中使用HTML5拥有的一些特性如：WebSQL, 地理位置定位，历史或设备方向等。Lungo.js是一个模块化并且完全可定制的框架。 18、xui.js 有时候你可能需要一个超轻量级的框架，只要拥有用于开发标准客户端所需要的功能如：DOM操作，事件处理，Ajax和一些动画效果。如果是这样的话，这个框架刚好非常适合你。整个框架采用GZIP压缩完之后只有4.2 KB。 19、EmbedJS EmbedJS是一个用于嵌入式设备的JavaScript框架如：移动电话，TVs、tablets和so forth。EmbedJS强大之处在于，它拥有专门为特定平台和浏览器如iOS, Firefox, Android等提供相应的开发版本。这样就能够以最少的代码，为用户提供最佳的体验。而且假如你喜欢自己定制，可以利用其提供的EmbedJS Build tool工具实现。EmbedJS基于Dojo实现，所以你如果熟悉Dojo API语法，那EmbedJS将是你最佳的选择。 20、zepto.js zepto.js是一个专为mobile WebKit浏览器(如：Safari和Chrome)而开发的一个JavaScript框架。它标榜自己在其简约的开发理念，能够帮助开发人员简单、快速地完成开发交付任务。更重要的是这个JS框架，是超轻量级的，只有5KB。zepto.js的语法借鉴并且兼容jQuery。 21、Baker Baker是用来在iPad或者iPhone平台上发布交互式的电子书或者电子杂志的HTML5电子书框架。 22、ChocolateChip-UI ChocolateChip-UI 是一个手机移动 Web 开发框架，采用 HTML5, WAML, CSS 和 JavaScript等技术实现。基于 ChocolateChip JavaScript 框架，包含最新的 ChUI.JS 和 ChUI.css. 23、Magazine Grid Magazine Grid 是一个超现代的 CSS 框架，用于 iPad 和 iPhone 手机，使用类似杂志的设计风格。Magazine Grid 可让用户使用 HTML5 元素来组织杂志页，非常轻量级(<4k)，在移动设备上加载非常快，对老的浏览器也支持。 24、Kendo UI Kendo UI是一个强大的框架用于快速HTML5 UI开发。基于最新的HTML5、CSS3和JavaScript标准。 Kendo UI包含了开发现代JavaScript开发所需要的所有一切，包括：强大的数据源，通用的拖拉(Drag-and-Drop)功能，模板，和UI控件。 25、HTML App Host Framework 这是一个用于构建基于 Windows Phone 7 的 HTML/JavaScript 托管框架，使用 HTML5 技术。该框架由支持在标准 xap 格式中嵌入 html 应用的控件。
html5上下滑动“翻页”实现，是真正的翻页
请问你解决了吗？我也想知道怎么做
html5中的transaction怎样使用回调函数
代码：<!DOCTYPE HTML><html><head><title>web storage的范例—本地数据库的使用</title><meta charset=”UTF-8″><script type=”text/javascript”>var datatable=null;var db=openDatabase(“liuyan”,”",”this is yugaga”,360*1024*1024);function init(){datatable=$(“datatable”);showAllData();}function showData(row){//显示一行记录var tr=document.createElement(‘tr");var td1=document.createElement(‘td");td1.innerHTML=row.name;var td2=document.createElement(‘td");td2.innerHTML=row.message;var td3=document.createElement(‘td");var t=new Date();t.setTime(row.time);td3.innerHTML=t.toLocaleDateString()+” “+t.toLocaleTimeString();tr.appendChild(td1);tr.appendChild(td2);tr.appendChild(td3);datatable.appendChild(tr);
video-js HTML5网页播放器如何设置到网页中间
把<video>元素放入到一个<div>标签中，如：<div><video>/*这里放入你的代码*/</video></div>然后设置这个<div>的样式使这个<div>居中。
html5中视频的播放与停止
stop.onclick=function(){myMov.currentTime=0;play.style.backgroundPosition="-246px -120px";myMov.pause();onOff=true;}
html5中怎么播放swf文件
<!DOCTYPE html> <html> <body> <div style="text-align:center;"> <button onclick="playPause()">播放/暂停</button> <button onclick="makeBig()">大</button> <button onclick="makeNormal()">中</button> <button onclick="makeSmall()">小</button> <br /> <video id="video1" width="420" style="margin-top:15px;"> <source src="/example/html5/mov_bbb.mp4" type="video/mp4" /> <source src="/example/html5/mov_bbb.ogg" type="video/ogg" /> Your browser does not support HTML5 video. </video></div> <script type="text/javascript">var myVideo=document.getElementById("video1");function playPause(){ if (myVideo.paused) myVideo.play(); else myVideo.pause(); } function makeBig(){ myVideo.width=560; } function makeSmall(){ myVideo.width=320; } function makeNormal(){ myVideo.width=420; } </script> </body> </html>
html5中我写的video为什么不能自动播放视频
格式不支持，MP4也有几种格式
优酷html5播放怎么切换到flash
这个是优酷网站自行选择的，应该是没有办法改变，除非使用低版本不支持html5的浏览器，但是这是指在电脑上，如果是手机，那么只有html5格式的。
html5 消除表格线
table 有个属性叫 border="0"
HTML5怎么读取json文件
严格来说应该是js，建议使用jq框架$(selector).getJSON(url,data,success(data,status,xhr))参数描述url 必需。规定将请求发送到哪个 URL。 data 可选。规定发送到服务器的数据。 success(data,status,xhr) 可选。规定当请求成功时运行的函数。额外的参数：data - 包含从服务器返回的数据status - 包含请求的状态（"success"、"notmodified"、"error"、"timeout"、"parsererror"）xhr - 包含 XMLHttpRequest 对象demo_ajax_json文件:{"firstName": "Bill","lastName": "Gates","age": 60}
面向移动设备的html5开发框架哪个最好
1、Titanium的Titanium开发平台使开发者可以通过HTML、PHP、JavaScript、Ruby、Python等Web编程语言开发手机、平板和桌面的原生App。其优势在于它可以让用户轻松地访问超过300个API以及定位信息。此外，提供针对特定行为或事件定制的统计。App的数据既可储存在云端，也可储存在设备上。2、APICloudAPICloud是一款“云端一体”的移动开发平台，信仰“云端一体”的理念，重新定义了移动应用开发。APICloud为开发者从“云”和“端”两个方向提供API，简化移动应用开发技术，让移动应用的开发周期从一个月缩短到7天。APICloud由“云API”和“端API”两部分组成，可以帮助开发者快速实现移动应用的开发、测试、发布、管理和运营的全生命周期管理。3、PhoneGapPhoneGap是一个免费且开源的开发环境，使开发者可以开发出在Android、Palm、黑莓、iPhone、iTouch及iPad等设备上运行的App。其使用的是HTML和JavaScript等标准的Web开发语言。开发者使用PhoneGap进行开发，可调用加速计、GPS/定位、照相机、声音等功能。PhoneGap还提供AdobeAIRApp以及在线的培训课程，帮助开发者了解原生API并在他们自己的平台上开发移动App。4、JavaScript是使用移动平台的JavaScript引擎来进行跨平台开发。逻辑部分自然无需多说，关键在于如何使用平台特性。是通过反射得到所有平台API，预编译它们，然后将这些API注入到JavaScript运行环境，接下来在Javascript调用后拦截这个调用，并运行native代码。是使用大量web开发的技巧来进行app开发，因为工具链和语言都非常熟悉受到了很多前端开发者的欢迎。5、KinveyKinvey同样是一个为移动应用开发者提供后台创建服务的平台。Kinvey强调加速移动应用开发与销售的“即取即用”理念。Kinvey的中间层与数据层均托管在多个云服务提供商处，包括Rackspace、Amazon与Microsoft。所有通过Kinvey存储的数据都会有四种方式备份：AmazonEC2、WindowsAzure、Rackspace以及Kinvey自己的服务器，假如其中一两个出现了故障，用户的数据依然安然无恙。
求背景音乐 https://sc.html5.qq.com/fx/u?r=UZK9UuD&t=
《i love Poland》电音老傅唱的网页链接
html5 里面的meta有什么用
定义：<meta> 元素可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词。<meta> 标签位于文档的头部，不包含任何内容。<meta> 标签的属性定义了与文档相关联的名称/值对。用法：SEO 优化为移动设备添加 viewportiOS 设备添加到主屏后的标题（iOS 6 新增）/否启用 WebApp 全屏模式/设置状态栏的背景颜色······Windows 8磁贴图标/颜色其他，如：添加 RSS 订阅/禁止数字识自动别为电话号码/不让android识别邮箱······
在html5中使用navigator.getUserMedia打开相机，要怎样进行关闭
大概的写了下 拍照结果： $(document).ready(init); function init() {//为了便于使用这个接口，先做一下兼容性处理navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia; //Google .
在HTML5中，border-radius属性可以用来设置（）网页效果
在HTML5中，border-radius属性可以用来设置（）网页效果 A.给HTML元素添加阴影 B.给HTML元素添加圆角(正确答案) C.设置HTML元素边框为虚线 D.设置HTML元素边框为波浪线
html5总如何设置导航左右上角直角为圆滑的弧度
两种方式：一种：给DIV设置背景图片，背景图片可以设计成圆角。适用范围广。建议使用这一种方法。另一种：用CSS3技术，设置{-webkit-border-radius:10px;-moz-border-radius:10px;border-radius: 15px;}只能在最新的浏览器上使用。IE浏览器基本不支持，当然，你可以导入一些外部文件来使IE支持CSS圆角。
html5 webkit-playsinline干什么用的
用html5的video方式播放视频时，在ipad上是默认原来大小的，而在iphone上是默认全屏播放的。HTML里video必须加上webkit-playsinline属性<video id="video" controls="controls" webkit-playsinline="true"><source src="test.mp4" type="video/mp4" />Your browser does not support HTML5 video.</video>
html5是什么？
万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次重大修改。
MAKA邀请函页面是用HTML5制作的吗
对的，通过maka平台制作的邀请函都是基于HTML5技术的，maka.im是以平台在线编辑的方式，通过模板组合、添加图文的方式来进行制作，省去了编程的复杂性，起码在制作html5手机页面上是比较方便，当然适不适合还是要自己用过才知道PS:HTML5的优势在于能够以更低的成本和更快的加载速度展现媲美Flash级的动画，而且语义标记使得SEO和网站维护更有优势。动画制作和跨平台的优势使html5的应用越来越广。
HTML5中如何用hover将图片显示出来
很容易，你可以让图片区域隐藏（display:none;）然后hover的时候（display:block;）。
如何读取HTML5 local storage 的值
在HTML 5中，localstorage是个不错的东西，在支持localstorage的浏览器中， 能持久化用户表单的输入，即使关掉浏览器，下次重新打开浏览器访问，也能读出其值， 下面给出的例子是使用jquery 在每次表单加载的时候，读localstorage的值，而在表单每次提交时则清楚其值的例子 首先是一个表单： 复制代码 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>HTML5 Local Storage Example</title> <!-- include Bootstrap CSS for layout --> <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/css/bootstrap-combined.min.css" rel="stylesheet"> </head> <body> <div class="container"> <h1>HTML5 Local Storage Example</h1> <form method="post" class="form-horizontal"> <fieldset> <legend>Enquiry Form</legend> <div class="control-group"> <label class="control-label" for="type">Type of enquiry</label> <div class="controls"> <select name="type" id="type"> <option value="">Please select</option> <option value="general">General</option> <option value="sales">Sales</option> <option value="support">Support</option> </select> </div> </div> <div class="control-group"> <label class="control-label" for="name">Name</label> <div class="controls"> <input class="input-xlarge" type="text" name="name" id="name" value="" maxlength="50"> </div> </div> <div class="control-group"> <label class="control-label" for="email">Email Address</label> <div class="controls"> <input class="input-xlarge" type="text" name="email" id="email" value="" maxlength="150"> </div> </div> <div class="control-group"> <label class="control-label" for="message">Message</label> <div class="controls"> <textarea class="input-xlarge" name="message" id="message"></textarea> </div> </div> <div class="control-group"> <div class="controls"> <label class="checkbox"> <input name="subscribe" id="subscribe" type="checkbox"> Subscribe to our newsletter </label> </div> </div> </fieldset> <div class="form-actions"> <input type="submit" name="submit" id="submit" value="Send" class="btn btn-primary"> </div> </form> </div>然后是js部分代码： 复制代码 代码如下: <script src="//code.jquery.com/jquery-latest.js"></script> <script> $(document).ready(function () { /* * 判断是否支持localstorage */ if (localStorage) { /* * 读出localstorage中的值 */ if (localStorage.type) { $("#type").find("option[value=" + localStorage.type + "]").attr("selected", true); } if (localStorage.name) { $("#name").val(localStorage.name); } if (localStorage.email) { $("#email").val(localStorage.email); } if (localStorage.message) { $("#message").val(localStorage.message); } if (localStorage.subscribe === "checked") { $("#subscribe").attr("checked", "checked"); } /* * 当表单中的值改变时,localstorage的值也改变 */ $("input[type=text],select,textarea").change(function(){ $this = $(this); localStorage[$this.attr("name")] = $this.val(); }); $("input[type=checkbox]").change(function(){ $this = $(this); localStorage[$this.attr("name")] = $this.attr("checked"); }); $("form") /* * 如果表单提交，则调用clear方法 */ .submit(function(){ localStorage.clear(); }) .change(function(){ console.log(localStorage); }); } });
html5调用json数据接口怎么写
用js的ajax，这个是jquery的一个简单例子，纯js的会稍微复杂点，$.ajax({ type: "post",//请求方式 dataType: "json",//数据类型 url: "",//请求地址 success: function (msg) { //成功之后调用 } });
HTML5的local storage存储的数据到底存到哪去了
基本使用方法如下：localStorage.name = "k1w1"; 这样的话，你的本地磁盘中就会有个数据库存下了这个数据。我无法接受数据写到了我的本地磁盘而我找不到它的确切位置，于是通过寻找发现：Chrome 的存储方式是以sqlite的数据库文件形式存储。存在C:UsersUsernameAppDataLocalGoogleChromeUser DataDefaultLocal Storage 中，虽然后缀名是.localstorege 但是实际上就是sqlite的数据库文件，可以用sqlite打开，并看到其中的数据。这么蛋疼的找它存在哪里是因为我想删掉在学习使用local storage时产生的一些垃圾数据，有点电脑洁癖。就像当初我喜欢选择性删除cookies一样。Firefox存在哪里暂时没有找到，感觉像是被加了密的sqlite数据库文件（这样的话firefox的安全性就高一些了），不过我每次关掉firefox它都会自动删掉所有浏览数据，所以也暂时不想找它存在哪了。