Material Design Lite教程
 材料设计精简版-概述
  2020-10-22-05:45:56            mango

什么是MaterialDesignLite?MaterialDesignLite(MDL是使用CSS,JavaScript和HTML创建的UI组件库。MDLUI组件在遵循现代Web设计原则(如浏览器可移植性,设备独立性)的同时,可帮助构建有吸引力,一致且功能正常的网页和Web应用程序以及正常降级。以下是Material

文章详情
 Material Design Lite-环境设置
  2020-10-22-05:46:23            mango

有两种方法可以使用MaterialDesignLite-本地安装-您可以在本地计算机上下载material。{primary}-{accent}.min.css和material.min.js文件,并将其包含在HTML代码中。基于CDN的版本-您可以直接从内容交付网络(CDN)将material。{primary}-{

文章详情
 材质设计精简版-布局
  2020-10-22-05:48:23            mango

在本章中,我们将讨论MaterialDesignLite中的不同布局。HTML5具有以下容器元素-<div>-为HTML内容提供通用容器。<header>-表示标题部分。<footer>-表示页脚部分。<article>-代表文章。<section>-为各种类型的节提供通用容器。MDL提供了各种CSS类,以对容器应用各

文章详情
 材质设计精简版-网格
  2020-10-22-05:49:08            mango

MaterialDesignLite(MDL)网格是用于为不同屏幕尺寸布置内容的组件。MDL网格由container/div元素定义和包围。网格在桌面大小屏幕中有12列,在平板电脑大小屏幕中有8列,在电话大小屏幕中有4列,其中每个大小都有预定义的边距和装订线。单元格按照其定义的顺序依次排列,但有以下例外:如果网格单元格

文章详情
 Material Design Lite-选项卡
  2020-10-22-05:49:37            mango

MaterialDesignLite(MDL)选项卡组件是一个用户界面组件,它有助于以排他的方式在单个空间中显示多个屏幕。MDL提供了各种CSS类,以对选项卡应用各种预定义的视觉和行为增强。下表列出了可用的类及其效果。Sr.No.ClassName&Description1mdl-layoutIdentifiesaco

文章详情
 材料设计精简版-页脚
  2020-10-22-05:50:57            mango

MDL页脚组件有两种主要形式:mega-footer和mini-footer。大型页脚比小型页脚包含更复杂的内容。大型页脚可以表示由水平规则分隔的多个内容部分,而小型页脚可以表示单个内容部分。页脚通常包含信息性内容和可点击内容,例如链接。MDL提供了各种CSS类,以对mega-footer和mini-footer应用各

文章详情
 材料设计精简版-徽章
  2020-10-22-05:51:24            mango

MDL徽标组件是一个屏幕通知,可以是数字或图标。通常用于强调项数。MDL提供了一系列CSS类,以对徽章应用各种预定义的视觉和行为增强。下表列出了可用的类及其效果。Sr.No.ClassName&Description1mdl-badgeIdentifieselementasanMDLbadgecomponent.Req

文章详情
 材质设计精简版-按钮
  2020-10-22-05:52:28            mango

MDL提供了一系列CSS类,可以对按钮应用各种预定义的视觉和行为增强。下表列出了可用的类及其效果。Sr.No.ClassName&Description1mdl-buttonSetsbuttonasanMDLcomponent,required.2mdl-js-buttonAddsbasicMDLbehaviortob

文章详情
 材料设计精简版-卡
  2020-10-22-05:53:03            mango

MDL提供了一系列CSS类,以应用各种预定义的视觉和行为增强功能并显示不同类型的卡。下表列出了可用的类及其效果。Sr.No.ClassName&Description1mdl-cardIdentifiesdivelementasanMDLcardcontainer,requiredon“outer”div.2mdl-c

文章详情
 材料设计精简版-进度条
  2020-10-22-05:53:22            mango

MDL提供了一系列CSS类,以应用各种预定义的视觉和行为增强功能并显示不同类型的进度条。下表列出了可用的类及其效果。Sr.No.ClassName&Description1mdl-js-progressSetsbasicMDLbehaviortoprogressindicatorandisarequiredclass.

文章详情

Made with ❤️ in Chengdu. Copyright reserved 2019-2022.

蜀ICP备20006366号-1