mdbootstrap4-pro
Version:
MDBootstrap 4 PRO
81 lines (70 loc) • 2.47 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Material Design Bootstrap</title>
<!-- Font Awesome -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- Bootstrap core CSS -->
<link rel="stylesheet" href="../../css/bootstrap/bootstrap.css">
<!-- Material Design Bootstrap -->
<link rel="stylesheet" href="../../css/mdb.css">
<link rel="stylesheet" href="../../css/style.css">
<style>
.md-select {
background-color: transparent;
border: none;
border-bottom: 1px solid #bdbdbd;
border-radius: 0;
outline: 0;
height: 2.1rem;
width: 100%;
font-size: 1rem;
-webkit-box-shadow: none;
box-shadow: none;
-webkit-box-sizing: content-box;
box-sizing: content-box;
-webkit-transition: all .3s;
transition: all .3s;
}
.md-select:active {
border-bottom: 1px solid #4285F4;
-webkit-box-shadow: 0 1px 0 0 #4285F4;
box-shadow: 0 1px 0 0 #4285F4;
}
</style>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="card">
<div class="card-body">
<div class="md-form">
<select name="options" id="select" class="browser-default md-select form-control">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4">Option 4</option>
<option value="5">Option 5</option>
</select>
<label class="active" for="form6">Choose your option</label>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- SCRIPTS -->
<!-- JQuery -->
<script type="text/javascript" src="../../js/jquery-3.2.1.min.js"></script>
<!-- Bootstrap tooltips -->
<script type="text/javascript" src="../../js/popper.min.js"></script>
<!-- Bootstrap core JavaScript -->
<script type="text/javascript" src="../../js/bootstrap.min.js"></script>
<!-- MDB core JavaScript -->
<script type="text/javascript" src="../../js/mdb.min.js"></script>
</body>
</html>