如何在css中创建悬停下拉列表

我创建了一个基于HTML和CSS的页面，我得到了整个屏幕的布局，但我不知道如何创建一个带有悬停的下拉菜单，我正在尽我最大的努力去接触我的灵感菜单。我的页面看起来不像我期望的那样。有人能给我一个明确的解决方案吗。我只使用HTML5或CSS3。请看一看

*{
填充：0；
保证金：0；
}
.屏幕面积{
字体：12px/1.5 Helvetica，Arial，无衬线；
线高：1.3em；
填充：0；
背景：#fff；
}
.导航栏，
.李节：第一个孩子，
.nav>li>a，
.content_head，
.李节：第一个孩子{
文本转换：大写；
}
.导航栏，
.nav_图标。下拉。下拉触发。下拉触发2{
填充：5px0；
}
.导航栏，
.下拉菜单{
宽度：100%；
}
.导航栏{
背景色：#333；
线高：20px；
字母间距：0.6px；
}
.集装箱导航，
合法的
.包裹{
保证金：0自动；
}
.clearfix{
显示：块；
}
.main_div，
.sub_菜单{
填充顶部：15px；
}
.main_div{
高度：60px；
}
.img{
宽度：115px；
填写：#000；
背景色：透明；
背景：url（logo_img.png）不重复；
}
.列表导航，
.img，
.导航，
连接
.下拉菜单.nav>li>a，
.nav>li>a，
.nav_login2，
.下拉列表，
.nav_图标。下拉。下拉触发。下拉触发2，
.nav_user2{
显示：内联块；
}
A.
a:悬停，
.徽章.年份{
文字装饰：无；
}
A.
a:主动，
a:悬停{
大纲：0；
}
.导航{
线高：1px；
}
.列表导航，
.nav_搜索2{
垂直对齐：顶部；
}
.店铺导航，
李娜先生{
空白：nowrap；
}
.下拉菜单.nav>li>a，
.搜索术语，
.下拉菜单{
框大小：边框框；
}
.下拉菜单.nav>li>a，
.下拉列表{
边框：2倍实心#FFF；
}
.下拉菜单.nav>li>a，
.导航栏{
字体大小：400；
}
.下拉菜单.nav>li>a，
.main_div，
.nav>li>a{
垂直对齐：中间对齐；
}
.下拉列表.nav>li>a{
填充：10px；
利润率：0.1px；
}
.下拉菜单.nav>li>a，
.搜索术语，
.main_div，
.nav>li>a{
颜色：#000；
}
.下拉列表，
.nav_user2，
.导航栏{
字体系列：Oswald、Helvetica、Arial；
}
.下拉列表，
.下降：悬停，
.下拉列表：悬停{
边框底部：无；
}
.下拉列表{
背景色：#FFFFFF；
填充：3倍；
利润率：0；
线高：3倍；
-webkit背面可见性：隐藏；
-webkit点击突出显示颜色：透明；
字体间距：.06px；
}
.nav>li>a{
字母间距：1px；
}
.下拉列表，
.下拉式按钮，
.下拉菜单\u触发器2，
李国章先生，
.btn_跟随a，
.导航栏{
显示：块；
}
.main_div，
.nav>li>a{
字号：12.5px；
字号：500；
填充：10px 6px；
}
.搜索术语{
/*右边填充：16px*/
背景色：#F4；
宽度：169px；
高度：33像素；
左侧填充：10px；
}
输入[类型=文本]{
边界：0；
}
.菜单搜索2{
宽度：211px；
垫顶：2件；
}
.按钮搜索{
颜色：#FFF；
}
.回来{
背景图片：url（“big_search.png”）；
-webkit转换：后台.3s；
过渡：背景。3s；
}
.菜单搜索2按钮{
高度：33像素；
宽度：42px；
字体大小：16px；
边界半径：0；
}
.搜查边境{
线高：1米；
光标：指针；
边界半径：3px；
-moz边界半径：3px；
-webkit边界半径：3px；
}
.按钮搜索{
溢出：可见；
-webkit外观：按钮；
}
保险商实验室{
列表样式类型：无；
}
.导航图标，
.nav_图标.nav>li{
左边距：0；
}
.nav_图标。下拉。下拉触发。下拉触发2，
.屏幕面积{
保证金：0；
}
.nav_图标。下拉。下拉触发。下拉触发2{
宽度：34px；
}
.下拉式按钮，
.下拉菜单\u触发器2{
宽度：14px；
}
.愿望清单{
字体大小：23px；
}
.降落：悬停{
z指数：100002；
宽度：31px；
}
.愿望列表：悬停{
颜色：#739FB1；
}
.下拉菜单\u触发器2{
背景：url（“cart.png”）不重复；
}
.trig_drop，
.登录{
边框：2倍实心透明；
}
.trig_drop:悬停，
.下拉：悬停，
.降落：悬停{
边框：2倍实心#333；
}
.下拉列表：悬停{
z指数：100003；
}
.trig_drop：悬停{
z指数：100001；
}
.nav_user2，
.徽章.年份{
字号：700；
}
.nav_user2，
.img{
高度：35px；
}
.nav_user2{
右边框：1px实心#BEBEBE；
填充顶部：7px；
字体间距：.6px；
宽度：164px；
}
.搜索术语，
.下拉列表，
.nav>li>a，
.导航栏，
.btn_跟随a，
.nav_login2.nav>li>a{
字体大小：13px；
}
阿杜斯海军{
左侧填充：5px；
垫底：3件；
}
.导航链接{
左边距：10px；
}
.下拉菜单，
包
.添加{
文本对齐：左对齐；
}
.下拉菜单{
宽度：225px；
填充：15px；
}
.下拉菜单{
位置：绝对位置；
顶部：50px；
右：0；
背景色：#FFF；
z指数：100000；
边框：2倍实心#000；
填充：20px；
}
.下拉菜单，
.按钮搜索，
.下拉列表{
-webkit转换：translateZ（0）；
}
.下拉菜单{
变换：translateZ（0）；
显示：无；
}
包
.集装箱导航，
.版权所有，
合法的
续{
宽度：1022px；
}
包
.页脚，
.法律{
明确：两者皆有；
}
.包裹{
填充：5px10px0；
高度：1261px；
}
.content_头{
边缘底部：20px；
}
.content\u标题.标签{
字体：700 25px/30px Helvetica，无衬线；
}
.标签a：悬停{
颜色：#6EB1EC；
}
.col_small.menu div{
边缘底部：15px；
}
.照片{
边框：1px实心#eee；
填充：2px；
宽度：150px；
背景：#fff；
}
.btn_follow{
利润率：10px0；
}
.菜单a：悬停，
.sub_菜单a：悬停{
颜色：#f06；
}
添加
斯莫尔上校{
宽度：150px；
}
.添加{
背景色：#bbb；
边界半径：4px；
填充：3px2px2px9px；
}
输入[类型=按钮]：悬停{
背景色：#AEE869
}
.sub_菜单{
边框顶部：1个点#ccc；
}
.子菜单h4 a{
颜色：#888；
}
.sub_菜单div{
边缘底部：15px；
}
.徽章{
边缘底部：50px；
}
.徽章.年份，
.btn_跟随a，
.导航栏{
颜色：#fff；
}
.徽章.年份，
.下拉列表.nav>li>a{
线高：16px；
}
.徽章.年份{
边界半径：50%；
背景色：#e9008d；
宽度：14px；
高度：14px；
字体大小：11px；
填充：0 2px 2px 1px；
}
.徽章.年份，
.徽章img{
右边距：5px；
}
.徽章.年份，
.菜单搜索2按钮，
.导航栏，
.横幅{
文本对齐：居中；
}
大上校，
孔蒂先生