1
2 <!-- Compiled and minified CSS -->
3 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
4
5 <!-- Compiled and minified JavaScript -->
6 <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
7
1
2 <!DOCTYPE html>
3 <html>
4 <head>
5 <!--Import Google Icon Font-->
6 <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
7 <!--Import materialize.css-->
8 <link type="text/css" rel="stylesheet" href="css/materialize.min.css" media="screen,projection"/>
9
10 <!--Let browser know website is optimized for mobile-->
11 <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
12 </head>
13
14 <body>
15
16 <!--JavaScript at end of body for optimized loading-->
17 <script type="text/javascript" src="js/materialize.min.js"></script>
18 </body>
19 </html>
20
1<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.2/css/materialize.min.css">
2<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.2/js/materialize.min.js"></script>
1
2 <div class="row">
3 <div class="col s12 m6">
4 <div class="card blue-grey darken-1">
5 <div class="card-content white-text">
6 <span class="card-title">Card Title</span>
7 <p>I am a very simple card. I am good at containing small bits of information.
8 I am convenient because I require little markup to use effectively.</p>
9 </div>
10 <div class="card-action">
11 <a href="#">This is a link</a>
12 <a href="#">This is a link</a>
13 </div>
14 </div>
15 </div>
16 </div>
17