布局示例

不同的布局样本,以帮助你开始入门使用。

为你提供一个提示,让你更好的了解通过 FEA 可以做些什么。另外不同的布局可以帮助你在创建不同的网站时作为一个参考。

首页

首页

组合

组合

博客

博客

文档

文档

联系

联系

登录

登录

禁止响应式布局

FEA 会自动帮你针对不同的屏幕尺寸调整你的页面,使其在各个尺寸的屏幕上表现良好。下面我们列出了如何禁用这一特性,就像这个非响应式布局实例页面一样。

禁止响应式布局有如下几步:

  1. 移除设置浏览器视口(viewport)的标签:<meta>
  2. 通过为 .container 类设置 widthmax-width 值从而覆盖框架的默认 width 设置,例如 width: 970px !important; max-width: none;。请确保这些设置全部放在默认的 FEA CSS 文件的后面。
  3. 如果使用了导航条,不要在导航条中使用响应式显示或隐藏类。
  4. 对于栅格布局,使用 .wdith-sm-* 类或替换掉 .wdith-md-*.wdith-lg-*,针对超小屏幕设备的栅格系统能够在所有分辨率的环境下展开。也可直接使用 .wdith-* 类。

禁止响应式特性的 FEA 布局模版

我们已经按照上面的步骤制作了一份模板。仔细阅读其源码并对照上面的步骤实践一下吧。

非响应式布局