手机端网页web开发要点

1.初始化

<!DOCTYPE html>

<html>

<head>

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

  <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>

  <meta name="MobileOptimized"
content="320">

  <meta name="format-detection"
content="telephone=no">

  <meta http-equiv="X-UA-Compatible"
content="IE=edge,chrome=1">

  <meta name="author"
content="johnye">

  <meta name="copyright" content="Copyright
(c) 1998-2013 Tencent.">

  <meta name="description"
content="手机腾讯网">

  <meta
name="apple-mobile-web-app-capable" content="yes">

  <meta
name="apple-mobile-web-app-status-bar-style" content="black">

  <title>screen_capture_injected="true" -
Google 搜索</title>

  <link
href="/images/apple-touch-icon-120x120.png" rel="apple-touch-icon"
sizes="120x120">

  <link type="text/css"
rel="stylesheet"
href="chrome-extension://ckphchjljlekndhjifdfpmmnlaijimcd/style.css">

</head>

<body screen_capture_injected="true"
huaban_collector_injected="true" bcloud="bcloud_1.2"
youdao="bind">
//摘自腾讯手机端

<body class="srp tbo" lang="zh-CN" marginheight="3" topmargin="3"
id="gsr" screen_capture_injected="true" huaban_collector_injected="true"
youdao="bind">//摘自腾google手机端

</body>

</html>

以上加粗部分一定要写

以下为腾讯教育网页版的两个mate标签,涉及到description 和 keywords

<meta name="description"
content="腾讯教育是中国用户量最大的教育门户网站,将国内外优秀教育信息资源和强大的产品服务紧密结合。下设考试、外语、出国、校园、博客等栏目,是在校学子及在职人员的在线充电平台。">

<meta name="keywords"
content="腾讯教育频道,招生,考试,高考,大学,高校,学生,学院,成考,民办,自考,远程,网校,研究生,考研,培训,外语,英语,四六级,雅思,托福,留学,出国,司法,公务员,会计,学习,校园,老师,家长,名师,男生,女生,校花,校草,edu,bbs,school,English,campus,learning">

手机端网页web开发要点,布布扣,bubuko.com

时间: 2024-08-02 06:59:52

手机端网页web开发要点的相关文章

移动手机端网页布局 常用的3种方式 总结

手机端网页现在已经发展的非常迅猛,很多公司度需要网页能兼容各种不同尺寸屏幕的手机. 下面我给大家讲讲我常用的3放布局方式: 1:响应式布局. 可以用px作为像素,网页进行平铺.全屏的用100%.高度可以用px写死,宽度可以用百分比.不管网页怎么拉伸,高度不变,宽度会相应的扩大. 2:em/rem  方式布局. 可以设置好html,body的字体大小,然后用不同的尺寸手机访问的时候,我们可以去修改body的字体大小,网页(网页的内容用rem设置宽度.高度)的之内容会自动进行缩放. 代码如: bod

手机端网页设计尺寸大小

手机端网页设计尺寸大小 对大于30W台客户端用户进行测试,得到的测试数据如下(数据来源于网络): 安全分辨率为1024 X 768 px 可建议大分辨率为1280 X 800 px 在Window XP常见分辨率1024×768下我们除掉任务栏,浏览器菜单栏以及状态栏后剩下的网页首屏高度平均值是584. 在Window 7常见分辨率1440×900下我们除掉任务栏,浏览器菜单栏以及状态栏后剩下的网页首屏高度平均值是716. 于设计来说,选取一个合适的尺寸作为正常大小和中等屏幕密度(尺寸的选取依据

手机端网页返回顶部js代码

<!DOCTYPE html>  <html>  <head>  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  <title>手机端网页返回顶部js代码</title>  <script src="http://libs.baidu.com/jquery/1.11.3/jquery.m

70.JS---利用原生js做手机端网页自适应解决方案rem布局

利用原生js做手机端网页自适应解决方案rem布局 刚开始我用的是下面这段代码,然后js通过外部链接引入,最后每次用手机刷新网页的时候都会出现缩略图 function getRem(pwidth, prem) { var html = document.getElementsByTagName("html")[0]; var oWidth = document.body.clientWidth || document.documentElement.clientWidth; html.s

[共通]手机端网页开发问题及解决方法整理

Q1:手机端开发网页,界面适应问题.A1: <meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> width - viewport的宽度 height - viewport的高度    initial-scale - 初始的缩放比例    minimum-scale - 允许用户缩放到的最小比

整理:手机端网页调试方案

(本文前身是技术分享的ppt,因此有些图直接是ppt导出的.画的图全是原创,转载请注明,谢谢.) 在手机端网页开发的特定阶段,需要查看手机端的界面.交互与体验.2011年时,开发时有很大麻烦: 相应的静态文件在测试服务器上,没有上线,需要绑定hosts而手机端直接绑定hosts是需要越狱/root的 有的手机浏览器根本不认hosts文件,如uc 手机端的调试工具匮乏断点调试.查看变量.查看样式等都很困难 在电脑端改变UA和屏幕大小,并不能简单的模拟手机端的情形.比如触摸的事件处理 在2012年后

七牛用户如何将视频转码成普清高清来适应不同的手机端或者web端

Qiniu 七牛问题解答 非常多人会用到七牛视频转码问题,要将视频转码成适用于各种终端的视频,也有的用户对转码服务的码率,帧率,分辨率等理解不多.不知道该怎样设置这些參数.以下我给大家科普一下. 问题解决方式 1,我们在七牛后台提供了各种转码的有用參数.大家能够看下: 假设你想要查看上面图片中各种处理样式的内容能够选中后,在以下会有參数的设定字符串. 2,用户存在一个误区,就是他并不知道码率,和帧率等參数的设定,事实上你用七牛转码的时候,转成某类的视频格式,是採用默认的码率等信息的.不用特定的去

专注手机端前端界面开发的ui组件和js组合

frozenui一款腾讯开发的简化版Bootstrap,只用于手机端 http://frozenui.github.io/ https://github.com/frozenui/frozenui zepto.js专注于手机端开发的js库 http://www.zeptojs.cn/            官方文档 http://www.css88.com/doc/zeptojs/         在线文档

手机端/网页 嵌套百度地图

网页嵌套几步到位: 地址:http://api.map.baidu.com/lbsapi/creatmap/index.html: 输入你想要定位的地点,添加标注,获取代码,拷贝到自己网页中即可. 但是体积大,在手机端很卡. 手机端效果图: 手机端嵌套: 代码如下: <html> <body> <legend>在线地图</legend> <div id='allmap' style='width:100%; height:360px'></