<!DOCTYPE html>
<html>
<head>
<style>
.fieldset input:invalid {
background-color: red;
}
.fieldset input:valid {
background-color: green;
}
</style>
</head>
<body>
<h1>Basic form element example</h1>
<p>
The name field is required. When a name is entered the field should turn
green.
</p>
<form action="" method="get" class="form">
<fieldset class="fieldset">
<label for="name">Name: </label>
<input type="text" name="name" id="name" required />
</fieldset>
<div class="form-example">
<input type="submit" value="Subscribe!" />
</div>
</form>
</body>
</html>