論壇 | 最新的Web開發教程
 

Angular Material Tutorial



Angular Material是一個UI組件庫Angular JS開發。 Angular Material成分有助於構建有吸引力的,一致的,功能性的網頁,並在堅持現代網頁設計原理類似瀏覽器的便攜性,設備獨立性和優雅降級Web應用程序。 它有助於創造更快,美麗,和網站的響應。 它是由谷歌材料設計靈感。


聽眾

本教程是為想學習的基礎知識的專業人士誰Angular Material以及如何使用它來創建更快速,美觀,網站的響應。 本教程介紹的所有基本概念Angular Material


先決條件

與之前繼續學習本教程,你應該有一個基本的了解Angular JS,HTML,CSS,JavaScript,文檔對象模型(DOM)和任何文本編輯器。 此外,它會幫助,如果你知道的基於Web的應用程序是如何工作的。


執行Angular Material在線

對於大多數在本教程中給出的例子,你會發現一個Try-it的選擇。 使用此選項來執行您的Angular Material當場程序,享受你的學習。

使用試試下面的例子Try-it可以在下面的示例代碼框右上角的選項-

<html lang="en" >
   <head>
      <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/ angular -material.min.css">
      <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/ angular .min.js"></script>
      <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/ angular -animate.min.js"></script>
      <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/ angular -aria.min.js"></script>
      <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/ angular -messages.min.js"></script>
      <script src="http://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/ angular -material.min.js"></script>
      <script type="text/javascript">    
         angular.module('firstApplication', ['ngMaterial']) ;
      </script>
   </head>
   <body ng-app="firstApplication" ng-cloak>
      <md-toolbar class="md-warn">
         <div class="md-toolbar-tools">
            <h2 class="md-flex">HTML 5</h2>
         </div>
      </md-toolbar>
      <md-content flex layout-padding>
         <p>HTML5 is the next major revision of the HTML standard superseding HTML 4.01, XHTML 1.0, and XHTML 1.1. HTML5 is a standard for structuring and presenting content on the World Wide Web.</p>
         <p>HTML5 is a cooperation between the World Wide Web Consortium (W3C) and the Web Hypertext Application Technology Working Group (WHATWG) .</p>
         <p>The new standard incorporates features like video playback and drag-and-drop that have been previously dependent on third-party browser plug-ins such as Adobe Flash, Microsoft Silverlight, and Google Gears.</p>
      </md-content>
   </body>
</html>