① 手机web版的页面（html/css）怎么兼容所有浏览器和各个手机屏幕分辨率
你说的这个问题，应该算的上是手机适配的问题！
既然是手机web端页面，这里的尺寸应该指的是浏览器的可视区域！
同样是5寸屏，一些有问题一些木有问题。
那他们的不同点就在于浏览器的可视区域不一样。
针对这类极小部分的适配问题。可以通过。css适配做出适当调整：
//手机浏览器是这个最大区域(可视区域375px)时，应用这个里面的样式
@mediascreenand(max-height:375px)
{
}
//手机浏览器是这个最小区域(可视区域375px)时，应用这个里面的样式
@mediascreenand(mim-height:375px)
{
}
//手机浏览器是这个最大区域(可视区域375px)介于345-75时，应用这个里面的样式
@mediascreenand(mim-height:375px)and(mim-height:775px)
{
}
具体你可以参考这个：
http://www.ibm.com/developerworks/cn/web/wa-cssqueries/
② 求一个简单的个人网页html模板
这种模板很多的，网络打开一个网页右键源代码就能找到了。
<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="viewport" id="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link href="{dede:global.cfg_templets_skin/}/images/apple-touch-icon-57.png" sizes="57x57" rel="apple-touch-icon">
<link href="{dede:global.cfg_templets_skin/}/images/apple-touch-icon-72.png" sizes="72x72" rel="apple-touch-icon">
<link href="{dede:global.cfg_templets_skin/}/images/apple-touch-icon-114.png" sizes="114x114" rel="apple-touch-icon">
<title>{dede:global.cfg_webname/}</title>
<meta name="keywords" content="{dede:global.cfg_keywords/}">
<meta name="description" content="{dede:global.cfg_description/}">
<link href="{dede:global.cfg_templets_skin/}/style/style.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="{dede:global.cfg_templets_skin/}/style/jquery-1.9.1.js"></script>
<script type="text/javascript" src="{dede:global.cfg_templets_skin/}/style/theme_trust.js"></script>
<style type="text/css">
html,
body {
margin: 0;
padding: 0;
}
.iw_poi_title {
color: #CC5522;
font-size: 14px;
font-weight: bold;
overflow: hidden;
padding-right: 13px;
white-space: nowrap
}
.iw_poi_content {
font: 12px arial, sans-serif;
overflow: visible;
padding-top: 4px;
white-space: -moz-pre-wrap;
word-wrap: break-word
}
</style>
<script type="text/javascript" src="{dede:global.cfg_templets_skin/}/main.js"></script>
<script>
jQuery(document).ready(function() {
jQuery('#openSidebar').click(function() {
jQuery('.wrapper').toggleClass('openNav');
});
jQuery('#menu a').click(function() {
jQuery('.wrapper').removeClass('openNav');
});
});
</script>
<script type="text/javascript" src="{dede:global.cfg_templets_skin/}/api"></script><script type="text/javascript" src="{dede:global.cfg_templets_skin/}/getscript"></script><link rel="stylesheet" type="text/css" href="{dede:global.cfg_templets_skin/}/bmap.css">
<style type="text/css">
html,
body,
wrapper {
height: 100%;
}
</style>
</head>
<body>
<div class="wrapper">
<div class="sidebar">
<div class="clearfix k1120">
<div class="navBox" id="openSidebar">
<a href="javascript:void(0)" class="navOpen"></a>
</div>
<div id="menu">
<ul class="clearfix">
<li><a href="#home" class="nav_home current"><span>首页<br /><b>Home</b></span></a>
</li>
<li><a href="#services" class="nav_services"><span>服务范围<br /><b>Services</b></span></a>
</li>
<li><a href="#case" class="nav_case"><span>案例展示<br /><b>Case</b></span></a>
</li>
<li><a href="#about" class="nav_about"><span>关于我们<br /><b>About us</b></span></a>
</li>
<li><a href="#news" class="nav_news"><span>新闻动态<br /><b>News</b></span></a>
</li>
<li><a href="#contact" class="nav_contact"><span>联系我们<br /><b>Contact us</b></span></a>
</li>
</ul>
</div>
</div>
</div>
<div class="pageMain">
<div id="header">
<div class="k1120 clearfix"><a href="{dede:global.cfg_basehost/}" id="logo">logo</a>
</div>
</div>
<div id="home" class="scrol-page">
<div class="banner">
<div class="b_1" style="background-position: 50% 0px;">
<div class="k1120 clearfix">
<div class="b_pic">
<div class="mac" style="margin-top: 0px; opacity: 1;"><img src="{dede:global.cfg_templets_skin/}/images/mac.png">
</div>
<div class="iphone" style="margin-top: 0px; opacity: 1;"><img src="{dede:global.cfg_templets_skin/}/images/iphone.png">
</div>
<div class="ipad" style="margin-top: 0px; opacity: 1;"><img src="{dede:global.cfg_templets_skin/}/images/ipad.png">
</div>
</div>
<div class="b_text" style="margin-top: 0px; opacity: 1;">
{dede:global.cfg_ggg/}
</div>
</div>
</div>
</div>
<div class="banner">
③ 用JS和html怎么做出一个简单的聊天窗口（类似微信）
单纯js和html无法实现通讯，需要搭建后台服务与前端WebSocket比较容易实现。
④ 如何建立一个html5 webscoket 实时语音聊天系统
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
var wsServer = 'ws://localhost:9999/webSocket.ashx'; //基于.NET4.5服务器地址
//var wsServer = 'ws://localhost:1818'; //基于.NET服务器地址
var websocket = new WebSocket(wsServer); //创建WebSocket对象
//websocket.send("hello");//向服务器发送消息
//alert(websocket.readyState);//查看websocket当前状态
websocket.onopen = function (evt) {
//已经建立连接
alert("已经建立连接");
};
websocket.onclose = function (evt) {
//已经关闭连接
alert("已经关闭连接");
};
websocket.onmessage = function (evt) {
//收到服务器消息，使用evt.data提取
evt.stopPropagation()
evt.preventDefault()
//alert(evt.data);
writeToScreen(evt.data);
//websocket.close();
};
websocket.onerror = function (evt) {
//产生异常
//alert(evt.message);
writeToScreen(evt.message);
};
function sendMsg() {
if (websocket.readyState == websocket.OPEN) {
msg = document.getElementById("msg").value;
websocket.send(msg);
writeToScreen("发送成功!");
} else {
writeToScreen("连接失败!");
}
}
function writeToScreen(message) {
var pre = document.createElement("p");
pre.style.wordWrap = "break-word";
pre.innerHTML += message;
output.appendChild(pre);
}
</script>
</head>
<body>
<div>
<input type="text" id="msg" value="beyond is number one!" />
<button onclick="sendMsg()">send</button>
</div>
<div id="output"></div>
</body>
</html>
H5e实训html5开发解答
⑤ 主流HTML5移动web开发框架
1.H5 做移动开发也分两种，一种就是正常的网页，一种是封装的成 App 在手机上跑的。下面我只大致介绍一下又哪些框架，具体的特性不是三两句能说完的，题主可以自行搜索相关资料。 后者比较知名的框架就是 PhoneGap、MUI 等等了。
2.而前者具体分的话还分 CSS 框架和 JS 框架。样式框架有很多了，常见的有 jQuery Mobile、Bootstrap、Kendo UI、Amaze UI 等等。JS 框架一般是 AngularJS、Backbone、ReactJS 等等，但说实话这些 JS 框架都比较繁重，一般是为比较复杂的场景设计的，如果你的页面需求很简单，那么大可以不用它们只用样式框架就好了。
⑥ 手机端的页面怎么开发，和web html有区别吗
两者之间没有区别。
有许多方法可以在手机上开发网页。 目前，html5的发展还不够平衡，导致主要浏览器对h5的支持不尽人意。 但是，其添加了@media属性（属于css3，html5和css3的名称在这里没有严格区分，实际上，是两种不同的技术）。
从那时起，网页创建可以根据用户所持有的设备的像素宽度来识别是否正在使用移动电话，从而在用户正在使用移动设备时下载移动页面。 但是，其存在某些缺点。 在这个阶段，手机的标准还很不规范。
(6)手机web聊天html模板扩展阅读：
目前现阶段的手机网页开发，主要的手段是：
其一，在meta标签中添加关于像素宽度的限制语句，然后实现css的相对宽度。 但是，界面会显得杂乱无章，因此很少使用此方法。
其二，这种方法是最常见的。 网站页面分为两个部分，分别面向计算机和手机。 当用户请求页面时，标题信息用于确定其是否是计算机浏览器，然后针对不同的请求发送不同的网页文件。 这样的网页通常不是静态的。
另外，开发移动网页时，可以使用Chrome的开发人员工具。 Chrome开发人员工具可以模拟手机页面的开发，还可以模拟许多设备，方便用户开发。
⑦ 怎么实现网页版的在线聊天啊，用html写，求源代码
这纯html是写不出来的 要后台程序语言写 你可以去网上下载一个 有很多