最近在模仿之前公司的官网页面www.yeeuu.com，大致静态页面都模仿好了,静态页面部分基本上就是用p+css布局实现的，具体细分为header,body,footer这几块，对于header中的下拉菜单它的实现效果不是太明白，我自己当初在仿照的时候下拉菜单部分完全是用css写的，但是视觉上的效果不是太美观，所以我就去看官网上header部分的源码，发现它还加了js部分上去，当我照抄header部分的html和css时，发现自己页面上出不来下拉菜单，想请教下各位，下拉菜单的效果是如何在html+css+js效果下实现的？
官网上的源码如下(我所的可能太啰嗦，可以直接在www.yeeuu.com上查看头部的下拉菜单)：
html部分：
CSS部分代码如下：
header {
background-color: rgba(17, 17, 17, 0.9); height: 60px; position: relative;}
header .content {
width: 1106px; margin: 0 auto; height: 100%;}
header .content .logo {
position: absolute; top: 50%; transform: translateY(-50%); cursor: pointer;}
header .content .nav-menu {
float: right; display: inline-block; height: 100%;}
header .content .nav-menu .nav-item-wrapper {
display: inline-block; height: 100%; line-height: 60px; margin-left: 56px; text-align: right;}
header .content .nav-menu .nav-item {
display: block; color: #bebebe; font-size: 14px; cursor: pointer; text-decoration: none;}
a {
background-color: transparent;}
header .subheader {
position: absolute; top: 60px; left: 0; background-color: #fff; width: 100%; height: 0; z-index: 15; -webkit-transition: height 0.3s; transition: height 0.3s; overflow: hidden; box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.18);}
header .subheader .subheader-content {
width: 1106px; margin: 0 auto; text-align: center; line-height: 1; padding: 20px 0; height: 100%; position: relative;}
header .subheader .subheader-content .item {
float: left; height: auto; top: 50%; transform: translateY(-50%); width: 20%; text-align: center; color: gray; display: inline-block; cursor: pointer; text-decoration: none; outline: none; font-size: 14px; position: relative;}
header .subheader .subheader-content .item:before {
position: absolute; right: 1px; top: 20px; width: 1px; height: 140px; border-right: solid 1px #e8e8e8; content: "";}
header .subheader .subheader-content .item .img-wrapper {
width: 100%; min-height: 145px;}
header .content .nav-menu .nav-item.active {
color: #e60044;}
现在的问题就是想用它的方法来实现，copy了它的html+css实现不了下拉菜单，F12看它的源码有用id选择器,估计是用js来选择元素，从而实现调用，哪位可以跟我详细讲下它这下拉菜单实现的原理.
PS:这是我自己下午做的下拉菜单
宽度我已经设置为和header部分的最大宽度1106px了，但是还是不能像官网界面那样下拉菜单能填充整个界面，官网界面如下：
我还试过用相对宽度100vw的方法，还是不管用，假如用自己这种纯css方法实现下拉菜单的方法，这个细节问题又该怎么解决？
看了下
.subheader的样式其中有heigth: 0;transition: height 0.3s;所以应该是改.subheaderheight的方式来实现的至于width问题，首先
header的position为relative,.subheader是绝对定位且是以header为定位上下文，.subheader的width为100%，所以.subheader和header的width是一样的。