"overview with navbar"
Bootstrap 4.0.0 Snippet by jeevan123456

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/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.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 ---------->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.2.2/css/swiper.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.2.2/js/swiper.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-T8Gy5hrqNKT+hzMclPo118YTQO6cYprQmhrYwIiQ/3axmI1hQomh7Ud2hPOy8SP1" crossorigin="anonymous">
<div class="top-head pt-1 border">
<div class="container">
<div class="row ">
<div class="col-md-12 text-right">
<ul class="list-inline ">
<a href="#"><li class="list-inline-item"><small><i class="fa fa-mobile fa-2x"></i> Download Mobile App</small></li></a>
<a href="#"><li class="list-inline-item"><small> Check On Road Price</small></li></a>
<a href="#"><li class="list-inline-item"><small> Feedback</small></li></a>
<a href="#"><li class="list-inline-item"><small> Ask a Question</small></li></a>
<a href="#"><li class="list-inline-item"><small><i class="fa fa-user"></i> My Account</small></li></a>
</ul>
</div>
</div>
</div>
</div>
<nav class="navbar navbar-expand-sm bg-light navbar-light border">
<div class="container">
<!-- Brand -->
<a class="navbar-brand" href="#">
<img src="http://velikorodnov.com/html/autotrader/images/logo.png" alt="Logo" style="width:120px;">
</a>
<!-- Toggler/collapsibe Button -->
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
<span class="navbar-toggler-icon"></span>
</button>
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
.mw30-text {max-height: 30px; overflow: hidden;}
.mh200-text {min-height: 200px;max-height:200px;overflow: hidden;}
/* Breadcum bar */
.bg-grey {background:#efefef}
.breadcrumb {background: none; margin: 0;font-weight: 300;padding-left: 0; font-size: 13px;}
.breadcrumb a {color: #999;}
.breadcrumb > .active {color: #696969;}
.breadcrumb > li + li::before {content: "\203A";color: #999;padding: 0 8px;}
/********** car horizon ************/
.car-image-block {padding:0px;margin:0px;}
.car-image-block img {min-height: 200px; overflow: hidden;}
/************* GENERIC *****************/
a {color:#696969;}
img {width:100%;}
.twhite {color:#fff!important;}
.twhite a {color:#fff!important;}
/************* Background ****************/
.bglight1 {background:#f2f2f2;}
/************* TOP-HEAD *****************/
.top-head ul li {padding-right:8px;}
/****************** Navigation **************/
.navbar-toggler {border-color: #dd0000;}
.navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgb(221, 0, 0, 0.7)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}
/**************** Banner Slider Carousel **************/
.carousel-inner img {width: 100%;}
.carousel-caption {color:#000;top:110px; bottom: auto; text-align:left;}
.carousel-caption h1 { color:#dd0000; background-color:#;}
/************ Services **************/
.most-car-box:hover {background: ; box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);}
/*********** TABS *******/
.nav-tabs { border-bottom: 1px solid #ccc; }
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments:

@jeevan123456 I have copied the same code in visual studio code but for me dropdown button is not working. Can I know the reason....

17wh1a0595 (-1) - 5 years ago - Reply 0