Materialize教程

上一篇

物化教程

Materialize是使用CSS,JavaScript和HTML创建的UI组件库。物化UI组件有助于构建引人注目的,一致且功能正常的网页和Web应用程序,同时坚持现代的网页设计原则,例如浏览器的可移植性,设备独立性和正常降级。它有助于创建更快,更美观,响应速度更快的网站。它的灵感来自Google Material Design。

听众

本教程适用于希望学习Materialize的基础知识以及如何使用它来创建更快,更漂亮,响应速度更快的网页和应用程序的专业人士。本教程介绍了实现的所有基本概念。

先决条件

在继续本教程之前,您应该对HTML,CSS,JavaScript,文档对象模型(DOM)和任何文本编辑器有基本的了解。此外,如果您知道基于Web的应用程序是如何工作的,它也会有所帮助。

在线执行物化

对于本教程中给出的大多数示例,您将找到一个Try-it选项。使用此选项可以当场执行您的Materialise程序并享受学习的乐趣。使用下面的示例代码框右上角的Try-it选项尝试以下示例。

<title>The Materialize Example</title>
      <meta name="viewport" content="width = device-width, initial-scale = 1">      
      <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/css/materialize.min.css">
      <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>           
      <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/js/materialize.min.js">
      </script>             
   
   
   
      <div class="card-panel teal lighten-2"><h3>Hello World!</h3></div>
   

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

蜀ICP备20006366号-1