把PC版网页变成手机版,不修改之前的界面,2者可以通用如何做到

zhengyingcan 2015-04-27 10:43:49
把PC版网页变成手机版,不需要修改界面, 网上的例子,感觉也不是很理想, 希望大家推荐一个优秀的例子,非常感谢.
...全文
28197 23 打赏 收藏 转发到动态 举报
写回复
用AI写文章
23 条回复
切换为时间正序
请发表友善的回复…
发表回复
qq_39444970 2017-07-07
  • 打赏
  • 举报
 回复
长痛不如短痛，改用响应式网站吧，以后更新起来也方便。响应式网站也有傻瓜式建站的，不用写代码这么麻烦，看看以下优酷视频吧 http://v.youku.com/v_show/id_XMjgxNDAwMzE4MA==.html?spm=a2hzp.8244740.userfeed.5!2~5~5~5!2~A
qq_33225170 2016-06-13
  • 打赏
  • 举报
 回复
楼主现在会了吗？求指教
qqw6789567 2015-07-23
  • 打赏
  • 举报
 回复
引用 16 楼 zhengyingcan 的回复:
[quote=引用 15 楼 u011320533 的回复:] 试下这个<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
能不能帮忙解释一下里面的属性是什么意思[/quote] width ---- viewport的宽度（width=device-width意思是：宽度等于设备宽度） height ------ viewport的高度（height=device-height意思是：高度等于设备宽度） initial-scale ----- 初始的缩放比例 minimum-scale ----- 允许用户缩放到的最小比例 maximum-scale ----- 允许用户缩放到的最大比例 user-scalable ----- 用户是否可以手动缩放
风吹裤衩轻飞扬丶 2015-05-04
  • 打赏
  • 举报
 回复
如果是没还没开始开发的话建议HTML5、各种适应屏幕大小。
nicetake 2015-05-04
  • 打赏
  • 举报
 回复
按设备宽度完全显示禁止缩放
tongxuejie 2015-04-29
  • 打赏
  • 举报
 回复
移动端需求大的话 最好重新写 分开弄
以专业开发人员为伍 2015-04-29
  • 打赏
  • 举报
 回复
引用 11 楼 zbdzjx 的回复:
我就是直接在手机上访问网站，直向看时，字会很小，横着看，就还好了。但操作起来还是很麻烦的。
如果字的大小会变，那就是没有针对手机设置 viewport。
以专业开发人员为伍 2015-04-29
  • 打赏
  • 举报
 回复
引用 10 楼 zhengyingcan 的回复:
<meta name="viewport" content="width=device-width, target-densitydpi=high-dpi" /> 是什么作用,我怎么感觉,加了与没有加,在手机上打开区别不大,
所以你需要修改参数然后看效果啊。
zbdzjx 2015-04-29
  • 打赏
  • 举报
 回复
我就是直接在手机上访问网站，直向看时，字会很小，横着看，就还好了。但操作起来还是很麻烦的。
zhengyingcan 2015-04-29
  • 打赏
  • 举报
 回复
<meta name="viewport" content="width=device-width, target-densitydpi=high-dpi" /> 是什么作用,我怎么感觉,加了与没有加,在手机上打开区别不大,
zhengyingcan 2015-04-29
  • 打赏
  • 举报
 回复
引用 15 楼 u011320533 的回复:
试下这个<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
能不能帮忙解释一下里面的属性是什么意思
nicetake 2015-04-29
  • 打赏
  • 举报
 回复
试下这个<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
dzwebs 2015-04-28
  • 打赏
  • 举报
 回复
别担心，再忍吧，以后就不用改为移动版的了，烦 因为以后手机性能越来越好，就等于电脑了，还用得着改吗， 其次，以后手机越来越起，屏幕又越来越大，也用不着改了吧？ 所以，再忍几年 ！
csharpcn 2015-04-28
  • 打赏
  • 举报
 回复
最快的就是修改CSS，最好适应多种分辨率 麻烦的就是把所有的页面标准化，重新的生成页面。自然能适应各种显示。
以专业开发人员为伍 2015-04-28
  • 打赏
  • 举报
 回复
我在 #3 楼的意思是，现在如果你开始考虑开发一个“响应式网页”，你至少要考虑20种屏幕大小和宽高比例并进行测试，不要只考虑3、4种来测试。 所以在你的开发机器上，应该用鼠标拖动浏览器的窗口，这样才能模拟各种比例、宽度、尺寸（从3寸到20寸）的屏幕，看看你的网页的效果。
於黾 2015-04-28
  • 打赏
  • 举报
 回复
5楼的朋友真天真 除非有一天,手机自带投影仪,否则手机是不可能变成跟电脑一样大的 真出了这么个手机,你会天天背着?
zhengyingcan 2015-04-28
  • 打赏
  • 举报
 回复
5楼的朋友真有趣
S314324153 2015-04-27
  • 打赏
  • 举报
 回复
你的样式基本要全改，这工作主要是前端的
以专业开发人员为伍 2015-04-27
  • 打赏
  • 举报
 回复
响应式布局，并不简单地是“变成手机版,不需要修改界面”这种考虑。你现在就可以把当前的浏览器的窗口用鼠标“拖动”来改变，例如改为你的屏幕的2/5宽、80%高，看看页面内容是不是看不清楚了。 当前这个csdn页面就不是响应式的。它中间的核心内容区是“死的”。这个页面就没法给手机用。
以专业开发人员为伍 2015-04-27
  • 打赏
  • 举报
 回复
首先要做到的，是在<head>第1行加上一个声明
<meta name="viewport" content="width=device-width, target-densitydpi=high-dpi" />
这里的参数有多种选择，例如可以使用手机最高分辨率，设备默认分辨率，或者自己指定210dpi等等参数。 其次就是布局的响应式问题，这就是你基本技术的一次改变，可能会复杂一些了。这需要慢慢修改。 例如如果将虚拟网页页面布局划分为5列，当实际屏幕的像素数在500以下时你可能每行只显示3列，然后另外两列则变成了插入的第二行了。或者图片都应该有一些通用的自动适应外边容器的宽度和高度的css。或者不同分辨率下的不同业务部分（用class区分）字体的字体的自动变大。 这样才能保证（上述列宽自动调整之类的）自动排版下的页面显示的内容比较清晰易读、留白比较合理。这个层次需要进行统一的设计。
加载更多回复（1）
3G 手机建站系统 最强大的手机建站系统智能软件下载功能模块，高级论坛
3G 手机建站系统 功能强大、界面简洁、操作简单 强大的业务功能模块，包括手机B2C移动购物，智能软件下载功能模块，高级论坛等 全球独创的3G版手机界面，颜色更加丰富，所有图片，文字，连接，非连接均以不同深浅颜色进行标识 3G版界面具有‘皮肤更换’功能，手机用户可以根据自己喜好改变手机网站页面的的颜色，风格 实现了PC电脑与手机内容同步，通过电脑也可以获取最新最全的手机信息 开发语言：PHP+XHTML+WML+CSS 3G版最突出的特点有： 一、 界面美化，3G版和以前的wap版相比界面更加美观，颜色更加丰富，所有图片，文字，连接，非连接均以不同深浅的颜色进行标识。 二、 3G版的界面具有 “皮肤更换”功能，手机用户可以根据自己的喜好改变手机网站页面的颜色，风格等，同时还增加了多媒体支持（背景音乐的播放，老的WAP版没有此功能）。 三、 3G版另外的一个特点是 实现PC普通浏览器也可以登录手机网站（即平台通用性），不仅打破电脑无需安装任何特殊浏览器（例如 OPERA等手机网站常用浏览器）即可及时访问手机网站，并且实现了PC与手机内容同步，通过电脑也可以获取最新最全信息。 一。安装步骤 1).将文件以二进制形式上传至服务器内 2).如果空间不是windows服务器的话,请修改部分文件属性为0777或0755否则安装不了或运行不正常. 3).再执行http://您的域名/install.php安装文件,安装此整站系统 4).整站系统后台管理目录是http://您的域名/admin_index.php 二。系统支持环境 php 4.4.7 及其以上版本 mysql 4.1 及其以上版本 zend 2.6 及其以上版本 三。unix文件权限设置 在unix类系统下 请手动设置以下目录及文件的权限为777, 注意：以*结尾的目录必须同时将其所有子目录及子文件都设置 以下为模块全安装模式 ./ ./css/* ./file/* 四。后台管理登陆 登陆地址：http://您的域名/admin_index.php
3G 手机建站系统 最强大的手机建站系统 手机B2C移动购物，智能软件下载功能模块，高级论坛
3G 手机建站系统 功能强大、界面简洁、操作简单 强大的业务功能模块，包括手机B2C移动购物，智能软件下载功能模块，高级论坛等 全球独创的3G版手机界面，颜色更加丰富，所有图片，文字，连接，非连接均以不同深浅颜色进行标识 3G版界面具有‘皮肤更换’功能，手机用户可以根据自己喜好改变手机网站页面的的颜色，风格 实现了PC电脑与手机内容同步，通过电脑也可以获取最新最全的手机信息 开发语言：PHP+XHTML+WML+CSS 3G版最突出的特点有： 一、 界面美化，3G版和以前的wap版相比界面更加美观，颜色更加丰富，所有图片，文字，连接，非连接均以不同深浅的颜色进行标识。 二、 3G版的界面具有 “皮肤更换”功能，手机用户可以根据自己的喜好改变手机网站页面的颜色，风格等，同时还增加了多媒体支持（背景音乐的播放，老的WAP版没有此功能）。 三、 3G版另外的一个特点是 实现PC普通浏览器也可以登录手机网站（即平台通用性），不仅打破电脑无需安装任何特殊浏览器（例如 OPERA等手机网站常用浏览器）即可及时访问手机网站，并且实现了PC与手机内容同步，通过电脑也可以获取最新最全信息。 一。安装步骤 1).将文件以二进制形式上传至服务器内 2).如果空间不是windows服务器的话,请修改部分文件属性为0777或0755否则安装不了或运行不正常. 3).再执行http://您的域名/install.php安装文件,安装此整站系统 4).整站系统后台管理目录是http://您的域名/admin_index.php 二。系统支持环境 php 4.4.7 及其以上版本 mysql 4.1 及其以上版本 zend 2.6 及其以上版本 三。unix文件权限设置 在unix类系统下 请手动设置以下目录及文件的权限为777, 注意：以*结尾的目录必须同时将其所有子目录及子文件都设置 以下为模块全安装模式 ./ ./css/* ./file/* 四。后台管理登陆 登陆地址：http://您的域名/admin_index.php
[精仿]360手机助手-14.2.6更新(CSkin Demo)
项目名称:[精仿]360手机助手-14.2.6更新(CSkin Demo) 界面库版本号：14.2.6 最新版本 下载内容： 精仿360手机助手源码一份, 可引用至工具箱最新版CSkin.dll一份 实现功能： 1.发光标题。 2.直角边框和阴影。 3.360手机助手主界面模仿。 4.多系统支持，不需要win8系统，即可实现win8风格的360手机助手。 5.自定义控件的美化使用。 界面库更新文档： CC2014-2.6 1.修复拖动好友出现的负值BUG和拖动后有机率会消失的问题。 2.好友列表DoubleClickSubItem事件添加回调参数MouseEventArgs，用于判断鼠标操作的一些参数，如：左键双击还是右键双击判断。 3.对SkinDataGridView属性进行部分重构，颜色美化属性增加。 4.窗体加入绘制模式边框颜色属性BorderColor和InnerBorderColor 5.解决SkinTabControl left和right绘制模式下tab标签悬浮样式不变化问题。 6.所有控件采用最高质量模式绘制文字，防止字体模糊以及锯齿。 CC2013-12.8 1.优化SkinTabControl的效率，不再呢么闪烁，360DEMO直接替换DLL，改部分属性小错误，就可以看到明显闪烁减少效果。 2.为SkinStrip分类的控件添加 是否统一变换字体颜色的属性。 3.为SkinAnimatorImg动画图片框控件添加Stretch属性，是否拉伸模式绘制动画。 4.修复SkinComboBox无法DataSource绑定项的BUG。 5.增加音乐播放器，萝莉人物窗体，等DEMO。 6.修复部分细节bug。 提示：窗体继承SkinMain,再设置下SkinBack,有你想不到的惊喜哦，此窗体是用于绘制异形窗体专用，你给他什么图片，窗体就会按照图片来绘制。有一个缺点就是，有透明像素的背景区域，控件不给于显示。 CC2013-10.30 1.由于SkinForm名字太多人使用，界面库命名正式改为CSkin.dll，官网www.cskin.net。 2.SkinTabControl标签中添加菜单箭头，可点击展开菜单。 3.SkinTabControl添加标签关闭按钮。 4.修复部分中文乱码问题。 5.优化好友列表右键菜单。 6.将窗体自定义系统按钮改为集合模式，可添加无数个自定义系统按钮。自定义系统按钮事件中可以 e.参数 来判断。 7.增加360安全卫士-DEMO案例。 8.增加SkinAnimatorImg控件，用于支持位图动画的播放。如360的动态logo。 9.各种细节BUG优化。 CC2013-10.11 1.添加SkinTabControlEx,加入更加自定义的美化属性和动画效果。 2.添加SkinAnimator,通用动画控件。 3.添加Html编辑器控件 4.修复SkinButton图标和文本相对位置的BUG CC2013-9.26 1.优化好友列表CPU占用 2.好友列表加入好友登录平台属性：安卓 苹果 WEBQQ PC 3.优化标题绘制模式，新添标题绘制模式属性。 4.新添标题偏移度属性。 5.加入圆形进度条控件：ProgressIndicator。 CC2013-9.5.2 1.优化截图控件，截图工具栏加入新功能。 2.解决个人信息卡和天气窗体显示后不会消失的问题。 3.各种细节BUG优化。 CC2013-9.5.1 1.解决贴边左右隐藏的BUG。 2.解决窗体点击事件不能触发的问题。 3.优化SkinButton继承父容器背景色的代码。 4.解决SkinButton异常错误。 CC2013-9.3 1.好友列表右键菜单没反应问题。 2.新增美化控件SkinDatagridview。 3.密码软件盘回删不了文字问题。
财经直播聊天系统最新官方版
财经直播聊天喊单系统： 1. 系统为开源技术制作，后期可进行二次开发升级。 2. 直播系统软件不需要安装，采用的是点PHP程序设计语言设计的，采用B/S架构，thinkphp主流框架，网页版本，公司的投资者不需要像别的通用软件那样安装软件，只要是网民都是可以成为潜在客户，方便维护。 为各位专业的金融投资机构提供了在线语音交流功能，即时文字、图片交流功能，即时喊单发布功能，用户信息整合等一系列针对投资交流的便捷功能。 财经直播聊天系统 v2.0 更新日志： 全新内核，完全独家发布 支持手机端和pc端消息 互通 界面简约大方 优化了性能
php网页如何适应手机端,PC网页的移动端适配兼容性应该如何实现自动适配
概念移动时代的今天，现如今随着智能手机的不断发展，移动端搜索的比例也在不断增加，而传统的PC站点在手机端的用户体验度很差，这容易导致大量用户的流失，所以做一个对应的手机站是非常有必要的前端代码的编写永远逃不过“兼容”二词，从前PC时代，因为IE的傲娇，导致程序猿们一直在兼容IE的道路上挣扎，如今移动设备的普及，仿佛让我们看到了希望，仿佛马上就要摆脱IE了，可是！一波还未平息，一波又来侵袭~移动端确...
.NET社区

62,046

社区成员

669,049

社区内容

发帖
与我相关
我的任务
社区描述
.NET技术交流专区
javascript云原生 企业社区
社区管理员
  • ASP.NET
  • .Net开发者社区
  • R小R
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告

.NET 社区是一个围绕开源 .NET 的开放、热情、创新、包容的技术社区。社区致力于为广大 .NET 爱好者提供一个良好的知识共享、协同互助的 .NET 技术交流环境。我们尊重不同意见，支持健康理性的辩论和互动，反对歧视和攻击。

希望和大家一起共同营造一个活跃、友好的社区氛围。

试试用AI创作助手写篇文章吧

+ 用AI写文章