Bootstrap Snippet Search Engine using HTML CSS Bootstrap

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!DOCTYPE html>
<html lang="en">
<head>
<title>HTML</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css?family=Roboto:400,500,700" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<!--[if IE]> <link href="~/Content/NewHomePage/all-ie-only.css" rel="stylesheet" /> <![endif]-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
    
    <!--search engine-->
<div class="container search">
<div class="row">
<ul class="nav nav-tabs nav-tabs1">
  <li class="active"><a data-toggle="tab" id="menu4" href="#home">Flights</a></li>
  <li><a data-toggle="tab" href="#menu1">Hotels</a></li>
  <li><a data-toggle="tab" href="#menu3">Cars</a></li>
</ul>
<div class="tab-content">
  <div id="home" class="tab-pane fade in active">
    <div class="form-check-inline trip">
        <label class="radio-inline">
        <input  type="radio" name="optradio" id="menu4" checked>Round Trip</label>
        <label class="radio-inline" >
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
body{margin:0px;padding:0px;font-size:16px;font-family:'Roboto', sans-serif;}
ul{margin:0px;padding:0px;}
a:hover{text-decoration:none;}
/*css*/
.mt{margin-top:0px;}
.mt10{margin-top:10px;}
.mt20{margin-top:20px;}
.mt40{margin-top:40px;}
.mb{margin-bottom:0px;}
.mb10{margin-bottom:10px;}
.mb20{margin-bottom:20px;}
.mb40{margin-bottom:40px;}
.pad{padding:0px;}
.pt10{padding-top:10px;}
.pt20{padding-top:20px;}
.pt40{padding-top:40px;}
.pb10{padding-bottom:10px;}
.pb20{padding-bottom:20px;}
.pb40{padding-bottom:40px;}
.pr{padding-right:0px;}
.width100 {width: 100%;}
.relative{position:relative;}
.absolute{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);}
/*banner*/
.mainBG{background:url(../images/banner.jpg)no-repeat center center;background-size:cover;height:782px;}
.navbar-default{background: rgba(30, 50, 102, 0.9);border:transparent;padding:10px;}
.navbar-default .navbar-nav li a{color:#fff;font-weight:500;}
.navbar-default .navbar-nav li a:hover{color:#f9d903;}
.navbar-default .navbar-nav .dropdown-menu li a{color:#000;}
/*search engine*/
.search{margin-top:15%;}
.nav-tabs1{border:transparent;border-radius:0px;}
.nav-tabs1 li a{padding:10px 30px;background:#009eef;color:#fff;border-radius: 0px 0px 0 0;border: 0px solid #ddd;margin-right: 1px;}
.nav-tabs1 li a:hover{background:#fff;border:transparent;color:#000;}
.nav-tabs1>li.active>a{background-color:#fff;border: 0px solid #ddd;}
.trip{padding:10px;}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

"Search Engine"
Bootstrap 3.3.0 Snippet by imsachin

Related: See More

Questions / Comments:

"Search Engine" Bootstrap 3.3.0 Snippet by imsachin

Related: See More

Questions / Comments:

"Search Engine"
Bootstrap 3.3.0 Snippet by imsachin