World Technology

তরুণরা গড়বে নতুন দেশ ডিজিটাল হবে বাংলাদেশ
Responsive Ads Here

Wednesday 27 December 2017

Bootstrap Responsive Button Design





<!DOCTYPE html>
<html>
<head>
<title>Bootstrap From</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
</head>
<body>
<div class="container-fluid">
<h1 class="text-center text-success">This is a Bootstrap Form</h1>

<form action="" method="">
<div class="row">
<div class="col-md-6 col-sm-6 col-xs-6">
<input type="text" name="" placeholder="Enter Name" class="form-control">
</div>
<div class="col-md-6 col-sm-6 col-xs-6">
<input type="text" name="" placeholder="Enter Institute Name" class="form-control">
</div>
</div>
<div class="row">
<div class="col-md-4">
<input type="text" name="" class="form-control" placeholder="Father's Name">
</div>
<div class="col-md-4">
<input type="text" name="" class="form-control" placeholder="Mother's Name">
</div>
<div class="col-md-4">
<select class="form-control">
<option> Please Select Your Country</option>
<option value="Bangladesh">Bangladesh</option>
<option value="India">India</option>
<option value="Nepal">Nepal</option>
</select>
</div>
</div>
<div class="row">
<div class="col-md-4 col-sm-4 col-lg-4 col-xs-4">
<input type="checkbox" name="" checked >I am Not Robot
</div>
</div>
<br>
<div class="row">
<div class="col-md-4 col-sm-4 col-lg-4 col-xs-4">
<button class="btn  btn-block btn-success">Save</button>
</div>


<div class="col-md-4 col-sm-4 col-lg-4 col-xs-4">
<button class="btn  btn-block btn-info">Update</button>
</div>


<div class="col-md-4 col-sm-4 col-lg-4 col-xs-4">
<button class="btn  btn-block btn-danger">Delete</button>
</div>
</div>
</form>
</div>
</body>
</html>

No comments:

Post a Comment

Thank You for your Structural Comment||