📅  最后修改于: 2020-10-22 05:45:36        🧑  作者: Mango

Material Design Lite，MDL是使用CSS，JavaScript和HTML创建的UI组件库。 MDL UI组件在遵循现代Web设计原则(如浏览器可移植性，设备独立性和平稳降级)的同时，有助于构建引人注目的，一致且功能正常的网页和Web应用程序。它有助于创建更快，更美观，响应速度更快的网站。它的灵感来自Google Material Design。听众本教程适用于渴望学习Mater...

📅  最后修改于: 2020-10-22 05:45:56        🧑  作者: Mango

什么是Material Design Lite？Material Design Lite（MDL是使用CSS，JavaScript和HTML创建的UI组件库。MDLUI组件在遵循现代Web设计原则（如浏览器可移植性，设备独立性）的同时，可帮助构建有吸引力，一致且功能正常的网页和Web应用程序以及正常降级。以下是Material Design Lite的主要功能-内置响应式设计。标准CSS，占用空间...

📅  最后修改于: 2020-10-22 05:46:23        🧑  作者: Mango

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

📅  最后修改于: 2020-10-22 05:48:23        🧑  作者: Mango

在本章中，我们将讨论Material Design Lite中的不同布局。 HTML5具有以下容器元素-<div>-为HTML内容提供通用容器。<header>-表示标题部分。<footer>-表示页脚部分。<article>-代表文章。<section>-为各种类型的节提供通用容器。MDL提供了各种CSS类，以对容器应用各种预定义的视觉和行为增强。下表列出了可用的类及其效果。Sr.No.Clas...

📅  最后修改于: 2020-10-22 05:49:08        🧑  作者: Mango

Material Design Lite（MDL）网格是用于为不同屏幕尺寸布置内容的组件。 MDL网格由container / div元素定义和包围。网格在桌面大小屏幕中有12列，在平板电脑大小屏幕中有8列，在电话大小屏幕中有4列，其中每个大小都有预定义的边距和装订线。单元格按照其定义的顺序依次排列，但有以下例外：如果网格单元格不适用于其中一种屏幕尺寸的行，它将流入下一行。如果网格单元格的指定列大...

📅  最后修改于: 2020-10-22 05:49:37        🧑  作者: Mango

Material Design Lite（MDL）选项卡组件是一个用户界面组件，它有助于以排他的方式在单个空间中显示多个屏幕。MDL提供了各种CSS类，以对选项卡应用各种预定义的视觉和行为增强。下表列出了可用的类及其效果。Sr.No.Class Name & Description1mdl-layoutIdentifies a container as an MDL component. Requ...

📅  最后修改于: 2020-10-22 05:50:57        🧑  作者: Mango

MDL页脚组件有两种主要形式：mega-footer和mini-footer。大型页脚比小型页脚包含更复杂的内容。大型页脚可以表示由水平规则分隔的多个内容部分，而小型页脚可以表示单个内容部分。页脚通常包含信息性内容和可点击内容，例如链接。MDL提供了各种CSS类，以对mega-footer和mini-footer应用各种预定义的视觉和行为增强。下表列出了可用的类及其效果。Sr.No.Class N...

📅  最后修改于: 2020-10-22 05:51:24        🧑  作者: Mango

MDL徽标组件是一个屏幕通知，可以是数字或图标。通常用于强调项数。MDL提供了一系列CSS类，以对徽章应用各种预定义的视觉和行为增强。下表列出了可用的类及其效果。Sr.No.Class Name & Description1mdl-badgeIdentifies element as an MDL badge component. Required for span or link element...

📅  最后修改于: 2020-10-22 05:52:28        🧑  作者: Mango

MDL提供了一系列CSS类，可以对按钮应用各种预定义的视觉和行为增强。下表列出了可用的类及其效果。Sr.No.Class Name & Description1mdl-buttonSets button as an MDL component, required.2mdl-js-buttonAdds basic MDL behavior to button, required.3(none)Set...

📅  最后修改于: 2020-10-22 05:53:03        🧑  作者: Mango

MDL提供了一系列CSS类，以应用各种预定义的视觉和行为增强功能并显示不同类型的卡。下表列出了可用的类及其效果。Sr.No.Class Name & Description1mdl-cardIdentifies div element as an MDL card container, required on “outer” div.2mdl-card–borderPuts a border to...

📅  最后修改于: 2020-10-22 05:53:22        🧑  作者: Mango

MDL提供了一系列CSS类，以应用各种预定义的视觉和行为增强功能并显示不同类型的进度条。下表列出了可用的类及其效果。Sr.No.Class Name & Description1mdl-js-progressSets basic MDL behavior to progress indicator and is a required class.2mdl-progress__indetermina...

📅  最后修改于: 2020-10-22 05:53:39        🧑  作者: Mango

MDL提供了一系列CSS类，以应用各种预定义的视觉和行为增强功能并显示不同类型的微调框。下表列出了可用的类及其效果。Sr.No.Class Name & Description1mdl-spinnerIdentifies a container as MDL spinner component and is a required class.2mdl-js-spinnerSets basic MD...

📅  最后修改于: 2020-10-22 05:54:29        🧑  作者: Mango

MDL提供了一系列CSS类，以应用各种预定义的视觉和行为增强功能并显示不同类型的菜单。下表列出了可用的类及其效果Sr.No.Class Name & Description1mdl-buttonIdentifies button as an MDL component and is required on button element.2mdl-js-buttonSets basic MDL be...

📅  最后修改于: 2020-10-22 05:54:53        🧑  作者: Mango

MDL提供了一系列CSS类，以应用各种预定义的视觉和行为增强功能并显示不同类型的菜单。下表列出了可用的类及其效果。Sr.No.Class Name & Description1mdl-sliderIdentifies input element as an MDL component and is required.2mdl-js-sliderSets basic MDL behavior to ...

📅  最后修改于: 2020-10-22 05:55:17        🧑  作者: Mango

MDL提供了一系列CSS类，以应用各种预定义的视觉和行为增强功能并显示不同类型的复选框。下表列出了可用的类及其效果。Sr.No.Class Name & Description1mdl-checkboxIdentifies label as an MDL component and is required on label element.2mdl-js-checkboxSets basic MD...