phptuts/starting_how_to_make_any_webpage_dynamic_with_js.html

## starting_how_to_make_any_webpage_dynamic_with_js.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Dynamic Javascript Webpage?</title>
    <link
      rel="stylesheet"
      href="https://fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic"
    />

    <!-- CSS Reset -->
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css"
    />

    <!-- Milligram CSS -->
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/milligram/1.4.1/milligram.css"
    />
    <style>
      body {
        color: black;
      }
      h1 {
        text-align: center;
      }
      ol {
        font-size: 1.3em;
      }
      button {
        width: 100%;
        margin: auto;
      }
      #example {
        position: fixed;
        top: 450px;
        left: 50%;
        transform: translateX(-50%);
        border: solid gray 2px;
        width: 400px;
        height: 400px;
      }
    </style>
  </head>
  <body>
    <div class="container">
      <div class="row">
        <div class="column">
          <h1>How to make a webpage dynamic with javascript?</h1>
        </div>
      </div>
      <div class="row">
        <ol>
          <li>Create variables to store your HTML elements.</li>
          <li>Create a function that responds to an event</li>
          <li>Attach that function to an event listener</li>
          <li>Change the html element's style in the function you created.</li>
        </ol>
      </div>
      <div class="row">
        <div class="column">
          <button id="btn" class="button">Reset</button>
        </div>
      </div>
      <div id="example"></div>
    </div>
    <script>
      // 1. Create variables to store your HTML elements.

      // 2. Create a function that responds to an event

      // 3. Attach that function to an event listener

     // 4. Change the html element's style in the function you created.

    </script>
  </body>
</html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<title>Dynamic Javascript Webpage?</title>
	<link
	rel="stylesheet"
	href="https://fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic"
	/>

	<!-- CSS Reset -->
	<link
	rel="stylesheet"
	href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css"
	/>

	<!-- Milligram CSS -->
	<link
	rel="stylesheet"
	href="https://cdnjs.cloudflare.com/ajax/libs/milligram/1.4.1/milligram.css"
	/>
	<style>
	body {
	color: black;
	}
	h1 {
	text-align: center;
	}
	ol {
	font-size: 1.3em;
	}
	button {
	width: 100%;
	margin: auto;
	}
	#example {
	position: fixed;
	top: 450px;
	left: 50%;
	transform: translateX(-50%);
	border: solid gray 2px;
	width: 400px;
	height: 400px;
	}
	</style>
	</head>
	<body>
	<div class="container">
	<div class="row">
	<div class="column">
	<h1>How to make a webpage dynamic with javascript?</h1>
	</div>
	</div>
	<div class="row">
	<ol>
	<li>Create variables to store your HTML elements.</li>
	<li>Create a function that responds to an event</li>
	<li>Attach that function to an event listener</li>
	<li>Change the html element's style in the function you created.</li>
	</ol>
	</div>
	<div class="row">
	<div class="column">
	<button id="btn" class="button">Reset</button>
	</div>
	</div>
	<div id="example"></div>
	</div>
	<script>
	// 1. Create variables to store your HTML elements.

	// 2. Create a function that responds to an event

	// 3. Attach that function to an event listener

	// 4. Change the html element's style in the function you created.

	</script>
	</body>
	</html>