Foundation教程 
  

  Foundation教程
 文章详情          2020年10月25日       mango

Foundation教程 Foundation是用于设计漂亮的响应式网站的高级前端框架之一。它适用于所有类型的设备,并为您提供HTML,CSS和JavaScript插件。本教程分为几个部分,每个部分都包含相关主题以及简单而有用的示例。 听众 本教程是为具有HTML和CSS基本知识并渴望开发网站的任何人准备的。完成本教程后,您会发现自己在使用Zurb Foundation Bootstrap开发We...


  Foundation-概述
 文章详情          2020年10月25日       mango

Foundation-概述   什么是Foundation? Foundation是用于设计漂亮的响应式网站的高级前端框架之一。它适用于所有类型的设备,并为您提供HTML,CSS和JavaScript插件。 Foundation最初是作为内部样式指南,由ZURB于2008年建立。ZURB是位于加利福尼亚坎贝尔的产品设计公司。它于2011年10月发布了Foundation 2.0作为开源。...


  Foundation-安装
 文章详情          2020年10月25日       mango

Foundation-安装   在本章中,我们将讨论如何在网站上安装和使用Foundation。 下载Foundation 当您打开链接foundation.zurb.com时,您将看到如下所示的屏幕- 单击Download Foundation 6按钮,您将被重定向到另一个页面。 在这里您可以看到四个按钮- 下载所有内容-如果希望框架中包含所有内容,例如香草CSS和JS,则可以下载此版...


  Foundation-入门项目
 文章详情          2020年10月25日       mango

Foundation-入门项目   您可以使用一些可用的模板开始您的项目开发,这些模板可以通过Yeti Launch或Foundation CLI安装。您可以使用Gulp构建系统使用这些模板来开始新项目,以处理Sass,JavaScript,复制文件等。 Foundation模板 Foundation模板类似于SASS模板,它包含平面目录结构,仅编译SASS文件,最好在仅使用SASS的情...


  Foundation-厨房水槽
 文章详情          2020年10月25日       mango

Foundation-厨房水槽   描述 它包含Foundation元素,可与Web应用程序顺利地协同工作。下表列出了一些Foundation组件- Sr.No. Component & Description 1 AccordionAccordions contain vertical tabs which are used on websites to expand and ...


  Foundation-全局样式
 文章详情          2020年10月25日       mango

Foundation-全球风格   在本章中,我们将研究全局样式。 Foundation框架的全局CSS包括有用的重置,以确保样式在各个浏览器中保持一致。 字体大小 默认情况下,浏览器样式表的字体大小设置为100%。默认字体大小设置为16像素。根据字体大小,将计算网格大小。若要具有不同的基本字体大小和不受影响的网格断点,请将$ rem-base设置为$ global-font-size值...


  Foundation-Sass
 文章详情          2020年10月25日       mango

Foundation-Sass   SASS帮助使代码在Foundation中更加灵活和可自定义。 兼容性 要为Foundation安装基于SASS的版本,应在Windows上安装Ruby。可以使用Ruby SASS和libsass来编译Foundation。我们建议使用node-sass 3.4.2+版本来编译SASS。 需要自动前缀 自动前缀处理SASS文件。 gulp-autopr...


  Foundation-JavaScript
 文章详情          2020年10月25日       mango

Foundation-JavaScript   在本章中,我们将研究JavaScript 。在Foundation中设置JavaScript很容易;您只需要jQuery。 JavaScript安装 您可以使用ZIP下载,程序包管理器或CDN来获取Foundation JavaScript文件。在您的代码中,您可以作为<script>标记提供指向jQuery和Foundatio...


  Foundation-JavaScript实用工具
 文章详情          2020年10月25日       mango

Foundation-JavaScript实用工具   Foundation包含用于添加常用功能的JavaScript实用程序。这是非常有用和易于使用的。可以在文件夹Your_folder_name / node_modules / foundation-sites / js中找到此JavaScript实用程序库 框 Foundation.Box库包含两种方法。 js / foundat...


  Foundation-媒体查询
 文章详情          2020年10月25日       mango

Foundation-媒体查询   媒体查询是CSS3模块,其中包括诸如宽度,高度,颜色之类的媒体功能,并根据指定的屏幕分辨率显示内容。 Foundation使用以下媒体查询来创建细分范围- 小-用于任何屏幕。 中-用于640像素或更宽的屏幕。 大-用于1024像素或更宽的屏幕。 您可以使用断点类来更改屏幕尺寸。例如,您可以将.small-6类用于小尺寸屏幕,并将.medium-4类用于...


  Foundation-网格
 文章详情          2020年10月25日       mango

Foundation-网格   描述 Foundation网格系统最多可在页面中扩展12列。网格系统用于通过一系列容纳您的内容的行和列来创建页面布局。 网格选项 下表简要介绍了Foundation网格系统如何在多个设备中工作。 Small devices Phones(<640px) Medium devices Tablets(>=640px) Large devices ...


  Foundation-Flex Grid
 文章详情          2020年10月25日       mango

Foundation-Flex Grid   网格取决于flex显示属性。它包含Flexbox可用的许多功能,例如自动堆叠,源顺序,垂直对齐和水平对齐。 浏览器支持 Chrome,Firefox,Internet Explorer 10 +,Safari 6 +,Android 4+和iOS 7+支持flex网格。 下表描述了Flex Grid的功能及其描述。 Sr.No. Featur...


  Foundation-表格
 文章详情          2020年10月25日       mango

Foundation-表格   在本章中,我们将研究Forms 。 Foundation为Forms提供了功能强大,简单易用的通用布局系统,该系统结合了表单样式和网格支持。 下表列出了Foundation中使用的表单元素。 Sr.No. Form element & Description 1 Form Basics Creation of forms is easy and v...


  Foundation-可见性类
 文章详情          2020年10月25日       mango

Foundation-可见性类别   描述 Foundation使用可见性类根据设备方向(纵向和横向)或屏幕尺寸(小,中,大或超大屏幕)显示或隐藏元素。 它允许用户基于浏览环境使用元素。 下表列出了Foundation的可见性类,这些类根据其浏览环境控制元素- Sr.No. Visibility Class & Description 1 Show by Screen Size ...


  Foundation-基本字体
 文章详情          2020年10月25日       mango

Foundation-基本字体   描述 Foundation中的版式定义了标题,段落,列表和其他内联元素,这些元素为元素创建了引人入胜且简单的默认样式。 下表列出了Foundation中使用的不同类型的排版- Sr.No. Typography & Description 1 Paragraphs Paragraph is a group of sentences define...


error: 内容受到保护 !!