CC Meeting #2 – Welcome to the WorldWideWeb!

You can copy the code below for the basic site template:

Example Blank Materialize Site:

<!DOCTYPE html>
<html>
<head>
    <!--Import Google Icon Font-->
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <!--Import materialize.css-->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
</head>

<body>

<div class="container">
    yo
    <!-- PUT CONTENT HERE!!! -->
</div>
<script type="text/javascript" src="js/materialize.min.js"></script>
</body>
</html>

Another example:

<!DOCTYPE html>
<html>
<head>
    <!--Import Google Icon Font-->
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <!--Import materialize.css-->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
</head>

<body>

<div class="container">
    <h1>Hello internet!</h1>
    <p>This is an amazing paragraph!</p>
    <a class="pink btn waves-effect">I am shiny</a>
    <a class="teal btn pulse">I am pulsing</a>

    <br/>
    <i class="material-icons">add</i>

    <br/>

    <div class="row">
        <div class="col s12 m6">
            <div class="card blue-grey darken-1">
                <div class="card-content white-text">
                    <span class="card-title">Card Title</span>
                    <p>I am a very simple card. I am good at containing small bits of information.
                        I am convenient because I require little markup to use effectively.</p>
                </div>
                <div class="card-action">
                    <a href="#">This is a link</a>
                    <a href="#">This is a link</a>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript" src="js/materialize.min.js"></script>
</body>
</html>

Access more copy and paste examples here: https://materializecss.com

Published by

Computer Club Executives

The account of the Computer Club Executives