monggo gan :) ini script dasarnya.. pake bootstrap 3 font-awesome dan jquery html

<div class="header">
		<div class="container">
			<div class="row">
				<h6>bukan situs untuk jual beli yang mudah & terpercaya</h6>
				<ul>
					<li><a href="">Premium Account</a></li>
					<li><a href="">Komunitas</a></li>
					<li><a href="">Blog</a></li>
					<li><a href="">Buka Bantuan</a></li>
					<li><a href="">Status transaksi</a></li>
				</ul>
			</div>
		</div>
	</div>
<header>
	<div class="container">
		<div class="row">
			<div class="logo">
				<h3><a href="">TutupLapak</a></h3>
			</div>
			<div class="category">
				<li class="kategori-btn" ><a href="#">Kategori <i class="fa fa-angle-down"></i></a>
					<ul class="kategori-wrap">
						<li><a href="">Promo</a></li>
						<li><a href="">Perawatan</a></li>
						<li><a href="">Kecantikan</a></li>
						<li><a href="">Kegantengan</a></li>
						<li><a href="">Promo</a></li>
					</ul>
				</li>
			</div>
			<div class="searchbar">
				<input type="text" placeholder="Aku gak mau belanja..">
				<a href="#" type="submit"><i class="fa fa-search"></i></a>
			</div>
			<div class="menukanan">
				<li><a href=""><i class="fa fa-shopping-cart"></i></a></li>
				<li><a href=""><i class="fa fa-camera"></i></a></li>
				<h4 class="login"><a href="">Login</a></h4>
				<h4 class="daftar"><a href="">Daftar</a></h4>
			</div>
		</div>
	</div>
</header>

css

	header{
		width: 100%;
		height: 50px;
		line-height: 50px;
		display: block;
		position: relative;
		top: 0;
		left: 0;
		z-index: 10;
		background: #F50057;
		color: #FFFFFF;
	}

	.header{
		position: relative;
		top: 0;
		left: 0;
		width: 100%;
		display: block;
		height: 20px;
		line-height: 20px;
		background: #D81B60;
		color: #FFFFFF;
	}
	.header h6{
		margin: 0;
		line-height: 20px;
		float: left;
	}
	.header ul{
		float: right;
	}
	.header li{
		display: inline-block;
		margin: 0 10px;
	}
	.header li a{
		color: #FFFFFF;
		font-size: 12px;
	}
	.logo{
		margin-right: 50px;
		display: block;
		float: left;
	}
	.logo h3{
		margin: 0;
		line-height: 50px;

	}
	.logo h3 a{
		color: #FFFFFF;
	}
	.category{
		margin-right: 30px;
		line-height: 50px;
		display: block;
		float: left;
		list-style: none;
	}
	.kategori-wrap{
		background: #FFFFFF;
		position: absolute;
		padding: 10px;
		margin: 0;
		width: 200px;
		border: 1px solid #BDBDBD;
	}
	.kategori-wrap li{
		padding: 5px 10px;
		line-height: 14px;
	}
	.kategori-wrap li a{
		color: #000000;
		font-size: 12px;
		display: block;
		font-weight: normal;
	}
	.kategori-wrap li:hover{
		background: #BDBDBD;
	}
	.category a{
		color: #FFFFFF;
		font-weight: bold;
	}
	.searchbar{
		display: block;
		float: left;
		width: 600px;
		height: 30px;
	}
	.searchbar input{
		width: 90%;
		height: 30px;
		display:block;
		float: left;
		border: none;
		padding: 10px;
		color:#000000;
	}
	.searchbar a{
		height: 30px;
		width: 30px;
		line-height: 30px;
		text-align: center;
		background: #FFFFFF;
		display:block;
		float: left;
		color: #9E9E9E;
	}
	.menukanan{
		display: block;
		float: left;
		line-height: 0;

	}
	.menukanan li{
		display: inline-block;
		margin: 0 5px;
	}
	.menukanan li a{
		color: #FFFFFF;
		font-size: 20px;
		padding: 5px;
	}
	.menukanan li a:hover{
		color: #E0E0E0;
	}
	.login{
		display: inline-block;
		font-size: 14px;
		margin: 0 10px;
	}
	.login a{
		color: #FFFFFF;
		font-weight: bold;

	}
	.daftar{
		display: inline-block;
		margin: 0 10px;
		padding: 8px 15px;
		border: 1px solid #FFFFFF;
		border-radius: 3px;
		font-size: 14px;
		transition: all 0.9s;
	}
	.daftar a{
		color: #FFFFFF;
		font-weight: bold;
		}
	.daftar:hover{
		background: #FFFFFF;
	}
	.daftar:hover a{
		color: #424242;
	}

js menu dropdown kategori

  $(document).ready(function(){
  $('.kategori-wrap').hide();
  $('.kategori-btn').hover(function(){
    $(this).find('.kategori-wrap').slideDown(100);
    },function(){
      $(this).find('.kategori-wrap').slideUp(100);
    });
});

silahkan eksperimen :) //oh ya itu belum responsive gan :D sama navigasinya kalo discrol belum top fix..