<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<script>
function Capital() {
var x = document.getElementById("fname");
x.value= x.value.toUpperCase();
}
function Small() {
var x = document.getElementById("lname");
x.value= x.value.toLowerCase();
}
</script>
</head>
<body>
<div class="container">
<div class="form-group">
<label>First Name</label>
<div>
<input id="fname" type="text" placeholder="Enter Name in small letters" class="form-control" onblur="Capital()">
</div> <br>
</div>
<div class="form-group">
<label>Last Name</label>
<div>
<input id="lname" type="text" placeholder="Enter name in Capital letters" class="form-control" onblur="Small()">
</div>
</div>
</div>
</body>
</html>
<html>
<head>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<script>
function Capital() {
var x = document.getElementById("fname");
x.value= x.value.toUpperCase();
}
function Small() {
var x = document.getElementById("lname");
x.value= x.value.toLowerCase();
}
</script>
</head>
<body>
<div class="container">
<div class="form-group">
<label>First Name</label>
<div>
<input id="fname" type="text" placeholder="Enter Name in small letters" class="form-control" onblur="Capital()">
</div> <br>
</div>
<div class="form-group">
<label>Last Name</label>
<div>
<input id="lname" type="text" placeholder="Enter name in Capital letters" class="form-control" onblur="Small()">
</div>
</div>
</div>
</body>
</html>
No comments:
Post a Comment