Foundation 中文手册

收藏(2)分享
阅读(10479)更新时间(2016-10-17)

《foundation开发手册》是foundation官方最新的在线参考手册。foundation是一个免费的前端框架。在本foundation文档中,您将会学习使用foundation创建响应式网页。


Foundation 用于开发响应式的 HTML, CSS and JavaScript 框架。 Foundation 是一个易用、强大而且灵活的框架,用于构建基于任何设备上的 Web 应用。 Foundation 是一个以移动优先的流行框架。

Foundation是国外最流行的 HTML、CSS 和 JS 框架,用于开发响应式布局、移动设备优先的 WEB 项目。

提示:在您开始学习Foundation之前,您应该对HTMLCSS JavaScript 知识有基本的了解。

Foundation是一款开源的前端框架,我们可以使用它快速创建页面原型。相比于其他同类型工具,Foundation的移动化方案更加出色;借鉴响应式web设计的思路和方法,Foundation对内容结构在不同类型设备中的的呈现方式进行了相应的预设。

下面让我们感受下第一个Foundation实例!

第一个Foundation实例

实例

<div class="row">
  <div class="medium-12 columns">
    <div class="panel">
      <h1>Foundation Page</h1>
      <p>Resize this responsive page to see the effect!</p>
      <button type="button" class="button small" >I Like It!</button>
    </div>
  </div>
</div>

<div class="row">
  <div class="medium-4 columns">
    <h3>Column 1</h3>
    <p>Lorem ipsum..</p>
  </div>
  <div class="medium-4 columns">
    <h3>Column 2</h3>
    <p>Lorem ipsum..</p>
  </div>
  <div class="medium-4 columns">
    <h3>Column 3</h3>
    <p>Lorem ipsum..</p>
  </div>
</div>

运行实例 »

点击 "运行实例" 按钮查看在线实例

提示:我们的Foundation教程将帮助您学习从初级到高级的Foundation知识。如果你有任何疑问,请前往PHP中文网Foundation社区提出你的问题,会有热心网友为你解答。

Foundation让前端开发更快速、简单。所有开发者、设计人员都能快速上手、所有设备都可以适配、所有项目都适用。

  • 响应式网站

Foundation 可以帮助你快速创建响应式网站,它为你提供了大量的HTML、CSS和JavaScript组件和功能;你也可以针对不同项目定制扩展功能。

  • 电子邮件

电子邮件框架可以接入任何第三方邮件平台,可以帮助你更加快速的创建响应性的HTML邮件。

本Foundation教程手册涵盖的内容

本Foundation教程涵盖所有Foundation基础和高级知识,包含了Foundation文本、Foundation表格、Foundation按钮、Foundation图标、Foundation标签、Foundation面板、Foundation表单、Foundation模态框等等知识介绍。

提示:本教程的每一章都包含了很多Foundation实例,您可以直接点击 "运行实例" 按钮在线查看结果。这些例子将帮助您更好地理解和运用Foundation。