我的网站没有响应，也没有调整大小。答案

【问题标题】：My website is not being responsive and not resizing.我的网站没有响应，也没有调整大小。
【发布时间】：2015-12-18 19:06:29
【问题描述】：

我真的需要一些帮助，我已经创建了我的网站http://hayleyryan.com/ 而且我无法将其重新调整为较小的浏览器窗口或较小的设备。

我在文档顶部包含了<meta name="viewport" content="width=device-width, initial-scale=1">，我还将所有内容都设置为百分比宽度。我已经查看了我所有的 CSS 是否有任何可能是原因 - 我找不到任何东西。在我删除元标记并稍后将其放回之前，它工作正常。

任何帮助将不胜感激，谢谢。

【问题讨论】：

标签： html css responsive-design resize responsiveness

【解决方案1】：

很遗憾，仅添加<meta name="viewport" content="width=device-width, initial-scale=1"> 无法制作响应式网页。它需要很多其他的东西。看看关于 stackoverflow 的另一个问题，这可能会有所帮助：How to implement responsive web design and its best practices

【讨论】：

嗨，Raam，感谢您的回答！对于使用错误的术语，我深表歉意——我知道我需要实施断点来重新对齐内容。我意识到“响应式”现在不是正确的词——对不起！我对这些术语还很陌生。

【解决方案2】：

Bootstrap 包括一个响应式、移动优先的流体网格系统，随着设备或视口大小的增加，它可以适当地扩展到 12 列

了解这个。 Responsive Web Design - Media Queries

 <meta name="viewport" content="width=device-width, initial-scale=1.0">

/* Extra small devices (phones, less than 768px) */
    /* No media query since this is the default in Bootstrap */

    /* Small devices (tablets, 768px and up) */
    @media (min-width: @screen-sm-min) { ... }

    /* Medium devices (desktops, 992px and up) */
    @media (min-width: @screen-md-min) { ... }

/* Large devices (large desktops, 1200px and up) */
@media (min-width: @screen-lg-min) { ... }

@media (max-width: @screen-xs-max) { ... }
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) { ... }
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) { ... }
@media (min-width: @screen-lg-min) { ... }

【讨论】：

【解决方案3】：

Raam Singh 是对的，但是对于您的具体情况，我想补充一下，您的“窗帘” ul 是绝对定位的。您应该使其不是绝对的或添加“宽度：100％；”。

你的“桌面”图片也应该有“宽度：100%；”如果你希望它可以调整大小。

【讨论】：

感谢 Laurynas，我认为这个位置一定是我之前删除的插件留下的样式。谢谢！它解决了我的问题。感谢您的提示，我也会修复桌面图像。 :)

【解决方案4】：

请在开始响应之前检查网站

http://getbootstrap.com/css/#grid-options

【讨论】：