微信公众号 讲师中心
首页
文章
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 自媒体 新闻
专题
后端开发 web前端 数据库 开发工具 php框架 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 新闻
AI工具
AI 聊天问答 Agent智能体 AI 文本写作 AI 绘画作图 AI 设计工具 AI 视频创作 AI 音频制作 AI 办公学习 AI 编程开发 Prompt指令
学习
大前端 后端开发 数据库 移动端 运维开发 计算机基础
编程手册
大前端 后端开发 数据库 移动端 运维开发 计算机基础
下载
js特效 网站源码 工具下载 类库下载 网站素材 学习资源 插件扩展 手机/移动开发 手机游戏
搜索
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程
自媒体 新闻
首页 > web前端 > html教程 > 正文

一个已经完成的PC网站，如何快速改造，让它能适应平板、手机等不同分辨率？_html/css_WEB-ITnose

php中文网
发布： 2016-06-24 11:56:16
原创
1289人浏览过

如题？除了为移动设备建立专门的网页，还有其他办法吗？

AI帮个忙
AI帮个忙

多功能AI小工具，帮你快速生成周报、日报、邮、简历等

AI帮个忙 55
查看详情 AI帮个忙

回复讨论(解决方案)

看你原来的css 结构了

但是 大部分 为桌面浏览器分辨率设计的页面  其实是不适合直接转成手机的 转成pad应该可以（大小差不多）

比如现在这个论坛的页面 排版和内容不变 只改css 转成手机版本  估计不好转

现在 响应式能适合各个设备 我看下来 原因就是 要么 减少内容  要么内容本来就很少

俩个方案：：自适应布局VS响应式布局
推荐使用自适应布局  。。。。
自适应布局有它自己的优势，因为它们实施起来代价更低，测试更容易，这往往让他们成为更切实际的解决方案。自适应布局可以看做响应式布局的“穷兄弟”，在资源有限的情况下就可以让它出马。特别是改进现有网站的时候尤其奏效，因为全部重写代码在这时并不可行。这种案例中，采用自适应布局是一个不错的出发点

paip.自适应网页设计 跟 响应式 设计的区别跟原理and实践总结 - attilax的专栏 - 博客频道 - CSDN.NET.htm
http://blog.csdn.net/attilax/article/details/24854037

大家都在看：

HTML速学教程(入门课程)
HTML速学教程(入门课程)

HTML怎么学习？HTML怎么入门？HTML在哪学？HTML怎么学才快？不用担心，这里为大家提供了HTML速学教程(入门课程)，有需要的小伙伴保存下载就能学习啦！

下载
来源：php中文网
收藏 点赞
上一篇：模拟实现ajax加载框_html/css_WEB-ITnose 下一篇：在head里的CSS link 居然粗现在body里了？_html/css_WEB-ITnose
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
最新问题
html如何连接按钮_HTML按钮（button）与表单/事件连接方法 按钮通过type="submit"提交表单，2.用onclick或addEventListener执行JavaScript，3.type="reset"重置表单，type="button"配合脚本避免默认行为，4.调用函数发送请求。
2025-11-11 12:55:37
799
CSS样式精确控制：为特定动态生成表格应用样式指南 本文旨在解决为动态生成的HTML表格应用CSS样式时，特定样式（如border-collapse）未能正确生效的问题。通过深入解析CSS选择器的精确性，特别是元素.类名与.类名元素之间的区别，我们将展示如何正确地为具有特定类名的表格及其内部单元格应用样式，确保所有CSS属性按预期工作。
2025-11-11 12:54:20
544
AEM HTL中动态添加HTML属性：解决rel属性不生效问题 本文深入探讨了在AdobeExperienceManager(AEM)的HTL模板中，如何正确且安全地为HTML元素动态添加属性，特别是当属性值来源于组件对话框时。针对常见的rel属性不生效问题，文章提供了使用properties对象结合context=‘attribute’HTL上下文属性的解决方案，并详细解释了其工作原理及应用场景，确保属性的正确渲染和安全性。
2025-11-11 12:54:02
835
Flexbox与媒体查询：构建灵活响应式头部导航 本教程详细阐述如何利用CSSFlexbox和媒体查询技术构建一个在不同屏幕尺寸下均能自适应的头部导航。通过优化HTML结构和CSS布局，实现导航元素在桌面端横向排列，在移动端垂直堆叠，确保所有关键组件在任何设备上都能清晰展示，并为进一步的交互式菜单功能奠定基础。
2025-11-11 12:53:10
911
JavaScript实现多视频播放控制：打造流畅的交互体验 本文将指导读者如何使用JavaScript管理页面上的多个视频元素，实现点击播放时暂停其他视频，确保同一时间只有一个视频播放的交互逻辑。通过querySelectorAll遍历视频元素并绑定事件监听器，我们将构建一个类似流媒体平台的视频播放控制系统，并探讨优化用户体验的进阶方案。
2025-11-11 12:52:35
678
Spring Boot Thymeleaf 中创建动态超链接的教程 本教程详细介绍了如何在SpringBoot应用中使用Thymeleaf模板引擎创建动态超链接。通过一个实际案例，演示了如何将模型中传递的URL数据渲染为可点击的HTML链接，利用th:href属性和Thymeleaf的URL表达式语法，实现列表数据的动态链接展示，提升用户界面的交互性。
2025-11-11 12:50:47
186
底部弹出层高级实现：模糊动效、平滑展现与无感布局影响 本文将深入探讨如何使用CSS构建一个功能完善的底部弹出层组件。该组件在鼠标悬停时能平滑展现，并伴有图片模糊到清晰的动态效果，同时确保弹出层的显示和隐藏不会影响页面其他内容的布局。教程将重点介绍如何巧妙运用position、transform和transition属性来解决常见的悬停区域受限和页面内容推移问题。
2025-11-11 12:47:28
793
深入理解CSS :active 状态下子元素样式控制 本文详细阐述了如何在CSS中利用:active伪类为处于激活状态的父元素其下的子元素应用特定样式。通过分析常见的选择器使用误区，特别是类选择器中遗漏点号的问题，本文提供了正确的CSS选择器语法及示例代码，帮助开发者准确地实现用户交互时的视觉反馈，确保样式规则的有效性和可维护性。
2025-11-11 12:46:20
292
优化HTML文本内容换行处理：Dart DOM操作深度解析 本教程深入探讨如何在HTML元素中精确添加换行符，特别是在处理包含混合文本内容和子元素的复杂DOM结构时。文章分析了常见方法的局限性，并提供了一个基于Dart的递归解决方案，通过遍历所有子节点（包括文本节点）来确保所有符合条件的文本内容都能正确地添加换行符，从而实现更精细的DOM操作。
2025-11-11 12:45:37
505
使用Flexbox和媒体查询构建响应式头部导航 本教程详细介绍了如何利用Flexbox布局和CSS媒体查询，优化HTML结构，实现一个在桌面和移动设备上均能良好展示的响应式头部导航。文章将通过重构代码，展示如何使导航元素在不同屏幕尺寸下自动调整布局，确保用户体验的一致性，并解决移动端布局混乱等常见问题。
2025-11-11 12:42:07
341
相关专题
更多>
热门推荐
开源免费商场系统广告
热门教程
更多>
相关推荐
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网：公益在线php培训，帮助PHP学习者快速成长！
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • PHP学习

  • 技术支持

  • 返回顶部