使网站快速响应的最简单方法是什么?

时间:2015-07-20 21:38:54

标签: html twitter-bootstrap responsive-design

我是初学者,我已经创建了一些我的网站,但我意识到它在所有设备和屏幕尺寸上都不会很好看。我愿意在我的网站上重新启动,并实现这个响应式框架,但我不知道从哪里开始,如何入门,使用哪个框架,或任何有关创建响应式网站的内容。我看过Bootstrap,但是我看到你必须使用他们提供的导航栏,我不希望这样。我想创建我自己定制的整个网站。我见过一些网站,当你在手机上时,它会自动变成像m.facebook.com这样的东西,他们这样做的方法是什么?他们是否为每个分辨率重写了整个代码?请帮忙!

2 个答案:

答案 0 :(得分:2)

如果您不想使用引导程序,则可以使用标准媒体查询“流体设计”。我创建了一个易于跟随的小提琴,其中包含一些有趣的内容供您试用http://jsfiddle.net/xfobotx6/7/

请记得将<meta name="viewport" content="width=device-width, initial-scale=1.0" />放入html的<head>部分,以使其发挥作用。

编辑强烈舆论基于“最简单的方法是什么?”我刚刚给你一个“a”方式的例子,但由你来决定最简单的方法:)

答案 1 :(得分:0)

如果您对响应式设计感兴趣,可以使用@Adam Buchanan Smith的答案。如果没有,只需用javascript做这样的事情来重定向页面,就像你从facebook.com说到m.facebook.com

if (screen.width <= 800) {
            window.location = "page.aspx";
        }

通过这样做,您必须至少完成您网站的2个版本(桌面和移动版)。在好的方面,您可以完全自定义它。