<!DOCTYPE html>
<html>
<head>
    <title>ES6 or ECMAScript 6</title>
    <style>
    	* {
            box-sizing: border-box;
        }
    	input, p {
        	font: 16px Calibri;
            width: 90%;
        }
        input {
        	padding: 12px;
            margin: 3px 0;
            border: 1px solid #ccc;
            border-radius: 4px;
        }
    </style>
</head>
<body>
    <div>
        <input type='text' id='name' placeholder='Enter your name' />
        <input type='button' value='Click it' id='bt' onclick='me_say_hello()' />
    </div>

    <p id="msg"></p>
</body>
<script>
    // I am using two ES6 features here in this function. The first is the “let” declaration and the second is the “arrow” (=>) function.

    let me_say_hello = () => {
		let name = document.getElementById('name').value;
        let msg = document.getElementById('msg');
        msg.innerHTML = 'Hello ' + name + ' ☺';
	}
</script>
</html>
Table options! ?
  • Rows:
  • Columns:
  • Table Width:
  • (%)

  • Background Color:
  • Text Color:
  • Header Color:

  • Row Highlight
  • Font:
  • Theme:

Table Border

  • Style:
  • Width:
  • px (pixels)
  • Color:
  • Collapse