Hi, I found the below script to validate form. It validate when field is empty but I need to know how to use the same css border for validating the input (i.e. all numbers only or email format). Any help will be great. Thanks.

HTML Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
 "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Content-Script-Type" content="text/javascript">
<meta name="Content-Style-Type" content="text/css">
<title>Example</title>

<script type="text/javascript">

function check (f) {
	var done = true, e, i = 0
	while (e = f.elements[i++]) {if (e.type == 'text' && !/\S/.test (e.value)) {
		e.parentNode.className = 'highlight'
		e.onfocus = function () {this.parentNode.className = ''}
		done = false
	}}
	return done
}

</script>

<style type="text/css">
form { margin:auto; width:11em}
fieldset {padding:1ex}
label {display:block; margin:0; text-align:left}
label.highlight input {border:dotted 1px #C0C}
button {display:block; margin:auto}
</style>

</head>
<body>
<form action="some-script.pl" onsubmit="return check (this)">
<fieldset>
<legend>Example</legend>
<label>Name<input type="text"></label>
<label>Rank<input type="text"></label>
<label>Serial number<input type="text"></label>
<button type="submit">Submit</button>
</fieldset>
</form>
</body>
</html>