开发网站,兼容pc访问与手机访问。_html/css_WEB-ITnose
公司开发了个 门户网站,在pc上访问没有问题,但是用手机自带的浏览球访问的时候,版面就有问题,布局非常不好。
我的想法是,能不能判断出用户是从手机访问的网站,还是用pc访问的网站,如果能,就可以做两套东西,pc访问布局丰富的门户网站,而手机访问精简版的网站。
如果不能,希望高手们给个解决方案。
回复讨论(解决方案)
pc和手机访问的页面肯定都是两套吧,pc的页面内容繁多,手机上一般就需要精简了。怎么调用判断应该是程序人员的事吧,不知道啊,呵呵
搜索一下 HTTP_ACCEPT
可以考虑做个入口,选择是进入PC还是手机的页面。
现在的智能手机上的浏览器基本上跟实际PC的浏览器没有太大差别了(除了速度),只要你的页面满足W3C标准,显示出来就应该是一样的。
如果一定要区分浏览器的话,可以看userAgent,每种浏览器都有独一无二的userAgent。userAgent在客户端可以用
window.navigator.userAgent
得到。在服务器端就要看你用什么技术了,一般查查文档都会提到。
现在的智能手机上的浏览器基本上跟实际PC的浏览器没有太大差别了(除了速度),只要你的页面满足W3C标准,显示出来就应该是一样的。
如果一定要区分浏览器的话,可以看userAgent,每种浏览器都有独一无二的userAgent。userAgent在客户端可以用
window.navigator.userAgent
得到。在服务器端就要看你用什么技术了,一般查查文档都会提到。
我现在不是要区分是哪种浏览器访问的,我是要区分是用手机访问的还是用电脑访问的。用userAgent只能区分用的哪种浏览器。
这个很容易,只要做两套不同布局的CSS样式表,然后象下面这样就行:
这个的原理,不是你这方进行判断,而是利用电脑或手机上浏览器本身的功能来实现。因为它们本身就是会检查最符合它们要求的CSS,如果你没有指定手机适用的CSS,则它只能使用供电脑使用的方案,所以效果不理想。
这种事情,本没必要自己做什么。学会利用。当然,非智能手机的话,是用WML之类的,那就必须转化你的网站了。但你似乎排除它们了,也对,没必要。
可以判断的 用js判断就可以了 如:!/\((iPhone|iPad|iPod)/i.test(navigator.userAgent) 这只判断 了是否是苹果的手持设备 你还可以判断其他的
关注中!
这个很容易,只要做两套不同布局的CSS样式表,然后象下面这样就行:
……
我也是打算要做两套的东西。
现在的问题是想实现自动跳转,比方说我的工程部署在www.myWebSite.com下,工程目录下有三个html,分别是index.html,computer.html,telphone.html.用户默认进入index.html下,此时判断用户是从手机进入还是从电脑进入。如果手机进入就进入telphone.html,电脑进入则进入computer.html
servlet
servlet
能说的详细点么。
引用 7 楼 theforever 的回复:
这个很容易,只要做两套不同布局的CSS样式表,然后象下面这样就行:
我也是打算要做两套的东西。
现在的问题是想实现自动跳转,
我说的两套不是你想的两套。
你想的两套,是从HTML到CSS甚至到图片整体做两套。
我指的是两套,只是指CSS,页面还是一个页,所以根本不需要跳转。根据设备不同,自然就调用不同的CSS方案,只要你页面布局安排好,CSS写好,一个页就会产生两种完全不同的适合不同设备的显示效果。
至于程序检测设备再跳转的方法,无论后台还是前台都能实现。
但那样,两套东西,做起来费时费力,维护起来更麻烦,一处变了另外一处也要去同步修改。
我的方法,就是考虑让你以现在和将来都最小的代价来实现。
至于程序检测设备再跳转的方法,无论后台还是前台都能实现。
但那样,两套东西,做起来费时费力,维护起来更麻烦,一处变了另外一处也要去同步修改。
我的方法,就是考虑让你以现在和将来都最小的代价来实现。
现在的要求是必须做两套,因为两个访问的内容完全不一样,手机能访问的就两个模块,“常见问题”和“软件下载”,但是电脑访问的内容就多了去了。最终讨论决定还是做两套,包括页面和css还有图片。
你上面说 检测设备 实现跳转很容易,能不能说一下你的方法呢。
除非手机浏览器和PC的浏览器用JS能取得区分的信息,不然没可能吧。
而且用户是用手机上网,还是用电脑上网,严格的来说是属于个人隐私的。
关注一下...不知道业界是怎么实现的阿? 比如wap.sina.com
手机网站怎么做,高手赐教
不知道楼主这个问题解决了没有,我也遇到同样的问题,就是pc和手机网站是两个完全不同的页面,就是相区分一下,不知道怎么办,楼主要是解决了能不能帮帮忙,告诉一下,谢谢。
js判断 navigator对象中用的浏览器的系统平台是什么

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

Video Face Swap
使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

热门话题

HTML适合初学者学习,因为它简单易学且能快速看到成果。1)HTML的学习曲线平缓,易于上手。2)只需掌握基本标签即可开始创建网页。3)灵活性高,可与CSS和JavaScript结合使用。4)丰富的学习资源和现代工具支持学习过程。

HTML定义网页结构,CSS负责样式和布局,JavaScript赋予动态交互。三者在网页开发中各司其职,共同构建丰富多彩的网站。

AnexampleOfAstartingTaginHtmlis,beginSaparagraph.startingTagSareEssentialInhtmlastheyInitiateEllements,defiteTheeTheErtypes,andarecrucialforsstructuringwebpages wepages webpages andConstructingthedom。

WebDevelovermentReliesonHtml,CSS和JavaScript:1)HTMLStructuresContent,2)CSSStyleSIT和3)JavaScriptAddSstractivity,形成thebasisofmodernWebemodernWebExexperiences。

网页批注功能的Y轴位置自适应算法本文将探讨如何实现类似Word文档的批注功能,特别是如何处理批注之间的间�...

GiteePages静态网站部署失败:404错误排查与解决在使用Gitee...

实现图片点击后周围图片散开并放大效果许多网页设计中,需要实现一种交互效果:点击某张图片,使其周围的...

HTML、CSS和JavaScript是Web开发的三大支柱。1.HTML定义网页结构,使用标签如、等。2.CSS控制网页样式,使用选择器和属性如color、font-size等。3.JavaScript实现动态效果和交互,通过事件监听和DOM操作。
