一个html5页面,第一个html页面

如何用HTML5制作网页

现在以HBuilder工具编写为例：

成都创新互联公司专注于无棣企业网站建设,响应式网站设计,商城系统网站开发。无棣网站建设公司,为无棣等地区提供建站服务。全流程定制网站开发，专业设计，全程项目跟踪，成都创新互联公司专业和态度为您提供的服务

1. 打开此工具，在项目管理器中右键单击创建一个web 项目

2.右键单击项目名称，新建一个HTML文件----form01.html

!DOCTYPE html

!--

作者：offline

时间：2017-01-06

描述：form表单

在form标签中，有两个经常使用的属性

action：表单提交服务器地址

method: 表单提交的方法/方式----get/post

其他提交方式---put delete

提交方式----get（默认的提交方式）

1.请求的参数放到地址栏中

2.不安全

3.存在缓存

4.传输数据的大小收到限制

提交方式----post

1.请求的参数放到http协议中

2.相对安全---账号密码等信息不会放到地址栏中

3.没有缓存

4.传输数据的大小限制较小

修改成post之后，可能会出现错误信息。

input标签：定义输入字段，用户可在其中输入数据。

属性：

type 指示 input标签的类型，默认的是text

按钮类型： 普通按钮 button 重置按钮 Reset  提交按钮 submit

value 定义要显示的文本。

--

html

head

meta charset="utf-8"

titleform表单1/title

/head

body

form action="" method="post"

    input type="text" name="username" value="zhangsan" /

    input type="submit" value="提交" /

/form

/body

/html

3.查看此网页是不是HTML5，主要看表头

4.HTML5新增了很多新内容，具体可以查看API，例如：在网页中嵌套音频/视频文件的格式

Html5页面是什么？有什么特点？有哪些应用是基于该技术？

相关知识可以去百度百科查看，那里有更详细的解释。善用搜索，善用百科、文库之类的知识资源平台。

这里简单说一下HTML5，html5是一个规范，其最大的特点在于总结了历代HTML语言的特点，强化了html语言的功能性和可扩展性，把大部分可用的标签和属性做了统一和规范。

以往，各浏览器都是一家独大，夜郎自大，或多或少的都在“发明”一些自己觉得不错的标签和属性，导致，网页设计和制作一直没有一个良好的规范，html5就是把这些以往出现的各种语法和用法，取长补短的做了一次总结，同时，简约未来网页应用的发展趋势，添加了一些新的功能内容，可以说，使用html5+css+js就可以开发一个动态（数据库、缓存数据、动画等）的网站，在这以前，动态是需要使用asp、php、jsp等动态变成语言实现的。

可以说，html5是语义化、性能优化、体验优化的产物，相对于以往的html5版本，html5还算完美（目前处于草案阶段，具体的内容还有待完善和商榷）。

html5适合开发网页应用，这里的网页应用是狭义的网页应用（类似桌面应用程序），而且，目前，html5在智能手机端的应用是属于较为常见的，这得益于智能机的原始浏览器属性（webkit内核，google android和apple IOS都是webkit内核的浏览器）和其应用特性（主要还是流量限制，html5有应用缓存功能和本地数据库）；

腾讯等一些优秀的互联网产品提供商也开始把自家的网页更新到了html5了（QQ邮箱的拖拽上传、腾讯微博的CSS3图片、QQ空间的标签语义化等），国内大部分的网页设计公司和团队，也逐渐开始设计和制作基于html5部分功能的网页和网站了；

可以说，html5是一个趋势，是一个向性能和体验看齐的规范化趋势。关于网上说的html5的“使命”是干掉flash（《HTML5和Flash之粗知浅见》），个人以为太过片面，放大了html5的某个功能而已。

html5页面怎么布局

1）像span这样的行内标记，定义它的margin-top和margin-bottom是无效的，除非你把它设置为块状元素才可以。Display:block

2）对于块状元素，你可以自由的使用外边距来定义版式和元素之间的距离。类似 DIV 等等，

3）无论什么元素，一旦设置为是浮动显示，就拥有了完整的盒模型结构，我们就可以使用外边距，内边距，边框，高和宽来控制的大小以及与其他对象之间的位置关系。

4）浮动是从网页布局的角度来定义元素的显示，而行内和块状属性主要是从元素自身的性质来定其显示的。

5）当元素没有定义边框时，可以把内边距作为外边距使用。有时候外边距会有重叠现象的。

6）当为元素定义背景图像时，内边距区域内可以显示背景图像，而对外边距区域来说，背景图像是达不到的，他永远都是透明状态

7）用div+css设计网页结构时，设计师满脑子都是网页内容，而非内容所呈现的效果。

8）块状元素：不管块状元素宽度是多少，他总会自动占据一行，因为在他末尾附加了一个换行符，而行内元素没有这个特点。块状元素有完整的盒模型结构，可以定义宽度和高度，而行内元素没有这个特性，无法通过高度来改变文本行的行高。

块元素的代表标记 div

行内元素的代表标记 span ，行内标记不具备组织结构框架

9）网页布局分为：自然布局，浮动布局， 定位布局

10）当一个元素被定义为浮动显示时，即定义为块状元素。并且该元素就会收缩自身体积为最小状态。所以，应该有个好的习惯即把浮动元素设置高和宽。如果没有设置，则元素会按照它所包含的内容大小来确定它的大小。

11）当元素浮动后，周边的对象会自动环绕浮动元素周围，形成一种环绕关系。

12）块状元素之间的外边距会有重叠现象，但是浮动元素之间的外边距不会发声重叠现象。

13）浮动元素移动，上移：margin-top:-**; 下移：margin-botom:-*px,其他以此类推。

14）一般定位元素（绝对或是相对元素）都会覆盖在文档流对象之上。但是，select元素的窗口控件还不完全支持z-index

15）在css定位布局中，一般遵循“外部相对定位，内部绝对定位”

16）在body中设置min-width:760px,可以避免布局重叠现象。

一个html5页面怎么创建多个websocket

1. WebSocket API简介

首先看一段简单的javascript代码，该代码调用了WebSockets的API。

[javascript] view plaincopy

var ws = new WebSocket(“ws://echo.websocket.org”);

ws.onopen = function(){ws.send(“Test!”); };

ws.onmessage = function(evt){console.log(evt.data);ws.close();};

ws.onclose = function(evt){console.log(“WebSocketClosed!”);};

ws.onerror = function(evt){console.log(“WebSocketError!”);};

这份代码总共只有5行，现在简单概述一下这5行代码的意义。

第一行代码是在申请一个WebSocket对象，参数是需要连接的服务器端的地址，同http协议使用http://开头一样，WebSocket协议的URL使用ws://开头，另外安全的WebSocket协议使用wss://开头。

第二行到第五行为WebSocket对象注册消息的处理函数，WebSocket对象一共支持四个消息 onopen, onmessage, onclose和onerror，当Browser和WebSocketServer连接成功后，会触发onopen消息；如果连接失败，发送、接收数据失败或者处理数据出现错误，browser会触发onerror消息；当Browser接收到WebSocketServer发送过来的数据时，就会触发onmessage消息，参数evt中包含server传输过来的数据；当Browser接收到WebSocketServer端发送的关闭连接请求时，就会触发onclose消息。我们可以看出所有的操作都是采用消息的方式触发的，这样就不会阻塞UI，使得UI有更快的响应时间，得到更好的用户体验。

怎么制作html5手机页面？

1、打开百度，在百度上搜索：易企秀，然后点击搜索，在搜索的结果中点击进入易企秀的官方网站。

2、进入后，先登录自己的账号，可以直接用QQ微信登录即可，登录后就可以开始制作自己的手机网页微场景了。

3、首先点击【我的场景】接着点击【制作场景】，接着会进入场景模板选择界面，里面有很多免费的模板。

4、可以在模板中心选择一个自己需要的点击，直接套用模板，也可以选择自己创建一个空白页面。

5、进入后就可以根据自己的需要，将模板里面的文字图片和音乐替换成自己需要的即可，如图所示。

6、还可以给自己的手机网页添加背景音乐，动画效果，跳转链接，特效组件等等。

如何声明 创建一个标准HTML5页面

dw自带生成

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""

html xmlns=""

head

meta http-equiv="Content-Type" content="text/html; charset=utf-8" /

title无标题文档/title

/head

body

/body

/html