マテリアライズチュートリアル
マテリアライズは、CSS、JavaScript、およびHTMLで作成されたUIコンポーネントライブラリです。マテリアライズUIコンポーネントは、ブラウザーの移植性、デバイスの独立性、適切な劣化などの最新のWebデザイン原則を遵守しながら、魅力的で一貫性のある機能的なWebページとWebアプリの構築に役立ちます。これは、より速く、美しく、応答性の高いWebサイトを作成するのに役立ちます。これは、Googleマテリアルデザインから着想を得ています。
このチュートリアルは、マテリアライズの基本と、それを使用してより速く、美しく、応答性の高いWebページやアプリを作成する方法を学びたい専門家を対象としています。このチュートリアルでは、マテリアライズのすべての基本的な概念について説明します。
このチュートリアルに進む前に、HTML、CSS、JavaScript、ドキュメントオブジェクトモデル（DOM）、および任意のテキストエディタの基本を理解している必要があります。さらに、Webベースのアプリケーションがどのように機能するかを知っていると役に立ちます。
このチュートリアルに記載されているほとんどの例では、 Try-itオプション。このオプションを使用して、マテリアライズプログラムをその場で実行し、学習を楽しんでください。次の例を使用してみてくださいTry-it 次のサンプルコードボックスの右上隅にあるオプションを利用できます。
<!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>