【问题标题】:How to test Responsive Web Design on XAMPP?如何在 XAMPP 上测试响应式网页设计?
【发布时间】:2012-06-06 17:03:07
【问题描述】:

有谁知道是否有一种方法可以在 XAMPP 等本地开发环境中测试响应式网页设计?我已经购买了几个响应式主题并在 XAMPP 上本地设置了它们,但我还没有找到一种方法来测试它并确保它们在所有设备上都能正常工作。

谢谢

【问题讨论】:

  • 您是否尝试过调整浏览器的大小?
  • 如何调整浏览器大小?

标签: php testing responsive-design xampp device


【解决方案1】:

您可以使用这些网站来测试您的设计。这些网站将允许您根据特定的设备尺寸调整浏览器的大小,并允许您在其中浏览您的网站。

  1. http://www.responsinator.com/
  2. http://resizemybrowser.com/
  3. http://www.jamus.co.uk/demos/rwd-demonstrations/
  4. http://codebomber.com/jquery/resizer/

【讨论】:

  • 谢谢,我试过 responsinator,但是如果主题/文件被上传到网络上。你知道我可以用来在本地机器上测试的任何解决方案吗?
  • 你可以用一样的,只要把你的本地地址,例如:localhost/path-to-your-file.php
【解决方案2】:

frietkot 是对的。这是我在 Mac 上所做的:

  • 在 Chrome 中安装 Resizer 扩展
  • 启动 MAMP
  • 启动 chrome,打开我的本地页面 (localhost:8888/the-path-to-your-page)
  • 点击了 Resizer 扩展图标

等等!

可能听起来很傻,但我也在努力寻找一种简单的方法来测试本地响应式设计,所以我希望这会对某人有所帮助。当然它仅限于 Chrome,但这是一个开始!

【讨论】:

    【解决方案3】:

    有一个名为ish 的视口大小调整工具。你可以在 gitHub here 上找到它。下载它并将提取的文件夹放在您的 localhost/htdocs 中。然后从您的浏览器调用它(例如 localhost/ish)。在 url 框(页面左上角)中,将 URL 放入您要检查的本地主机上的站点。

    是的。是另一个视口大小调整工具。它被称为“ish”。因为它关注的是一般范围(small-ish. medium-ish. large-ish.),而不是流行的设备宽度。

    【讨论】:

      【解决方案4】:

      尝试调整浏览器的大小。如果您的网站发生变化,它就会做出响应。

      如果您想在移动设备(例如手机或平板电脑)上进行测试。您必须将其上传到服务器或设置具有 Internet 访问权限的本地服务器(也许它仅适用于移动浏览器中的 192.168.1.1 ip 地址)。

      【讨论】:

        【解决方案5】:

        这是一个测试响应性的小工具,专门用于测试 Bootstrap 断点:

        http://deneskellner.com/reframe

        享受:)

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 2018-12-03
          • 1970-01-01
          • 2016-12-09
          • 2015-09-18
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多