Forum | Najnowsze tutoriale tworzenie stron internetowych
 

zmaterializować Tutorial



Urzeczywistnić to biblioteka komponentów UI utworzone z CSS, JavaScript i HTML. Zmaterializować elementy UI pomaga w tworzeniu atrakcyjnych, spójnych i funkcjonalnych stron internetowych i aplikacji internetowych przy zachowaniu nowoczesnych zasad projektowania stron internetowych, takich jak przenoszenie urządzenia przeglądarki, niezależność i wdzięku degradacji. Pomaga w tworzeniu szybciej, piękne i elastycznych stron internetowych. Jest on inspirowany z Google Materiał Design.


Publiczność

Ten poradnik jest przeznaczony dla profesjonalistów, którzy chcieliby nauczyć się podstaw projektowania materiałów Lite i jak go używać do tworzenia szybciej, piękne i elastycznych stron internetowych. Ten poradnik wyjaśnia wszystkie podstawowe koncepcje projektowania materiałów Lite.


Wymagania

Przed przystąpieniem do tego kursu, trzeba mieć podstawową wiedzę na temat HTML, CSS, JavaScript, Document Object Model (DOM), oraz dowolnego edytora tekstu. Ponadto, to pomoże, jeśli wiesz, jak działają aplikacje internetowe oparte.


Wykonuje się zmaterializować Online

Dla większości z przykładów podanych w niniejszym poradniku znajdziesz opcjęTry-it.Użyj tej opcji, aby wykonywać swoje programy zmaterializować na miejscu i cieszyć się swoją naukę.

Wypróbuj poniższy przykład używając opcjiTry-one dostępne w prawym górnym rogu poniższym polu kod przykładowy -

<!DOCTYPE html>
<html>
   <head>
      <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>             
  </head>
  <body>
      <div class="card-panel teal lighten-2"><h3>Hello World!</h3></div>
   </body>
</html>