Homework SourseHow can I create the task 3 like the screenshoot using Boots
How can I create the task 3 like the screenshoot using Bootstrap HTML?
We take inspiration from the World\'s best cuisines, and create a unique fusion experience. Our lip-smacking creations will tickle your culinary senses! A unique combination of Indian Uthappam and Tappan pizza, topped with Cergol\'s owes, ripe vine cherry tomatoes. Vidalia one. Guntur chilies and Buffalo Paneer.Solution
I am using Bootstrap CDN links so please use internet while run this code.
<!DOCTYPE html>
<html xmlns=\"http://www.w3.org/1999/xhtml\">
<!--<html lang=\"en\">-->
<head>
<title>Bootstrap Example</title>
<meta charset=\"utf-8\">
<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">
<link rel=\"stylesheet\" href=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css\">
<script src=\"https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js\"></script>
<script src=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js\"></script>
<link rel=\"stylesheet\" href=\"https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css\" />
</head>
<body>
<div class=\"container\">
<div class=\"row\" style=\"margin-top:20px;\">
<div class=\"col-lg-3\">
<h3>Reserve a Table</h3>
</div>
<div class=\"col-lg-8\">
<form class=\"form-horizontal\">
<div class=\"form-group\">
<label class=\"control-label col-sm-3\" for=\"Number of Guest\">Number of Guest:</label>
<div class=\"col-sm-9\">
<label class=\"radio-inline\">
<input type=\"radio\" name=\"optradio\">1</label>
<label class=\"radio-inline\">
<input type=\"radio\" name=\"optradio\">2</label>
<label class=\"radio-inline\">
<input type=\"radio\" name=\"optradio\">3</label>
<label class=\"radio-inline\">
<input type=\"radio\" name=\"optradio\">4</label>
<label class=\"radio-inline\">
<input type=\"radio\" name=\"optradio\">5</label>
<label class=\"radio-inline\">
<input type=\"radio\" name=\"optradio\">6</label>
</div>
</div>
<div class=\"form-group\">
<label class=\"control-label col-sm-3\" for=\"Date and Time\">Date and Time:</label>
<div class=\"col-sm-4\">
<div class=\"input-group\">
<input type=\"text\" name=\"name\" value=\" \" class=\"form-control\" />
<span class=\"input-group-addon\"><i class=\"fa fa-calendar\" aria-hidden=\"true\"></i></span>
</div>
</div>
<div class=\"col-sm-4\">
<div class=\"input-group\">
<input type=\"text\" name=\"name\" value=\" \" class=\"form-control\" />
<span class=\"input-group-addon\"><i class=\"fa fa-clock-o\" aria-hidden=\"true\"></i></span>
</div>
</div>
</div>
<div class=\"form-group\">
<div class=\"col-sm-offset-3 col-sm-10\">
<input type=\"submit\" class=\"btn btn-info\" name=\"name\" value=\"Resevered\" />
</div>
</div>
<div class=\"form-group\">
<div class=\"col-sm-offset-3 col-sm-10\">
<div class=\"alert alert-warning alert-dismissable\">
<a href=\"#\" class=\"close\" data-dismiss=\"alert\" aria-label=\"close\">×</a>
<strong>Warning!</strong> Please <b>call</b> us to resereve for more then six guests.
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</body>
</html>
