Html 如何使用当前CSS添加下拉菜单？

我了解使用当前HTML制作下拉菜单的基本知识，但不了解如何使用当前CSS来制作下拉菜单。我对HTML和CSS也很陌生，非常感谢您的帮助！ 以下是我的HTML编码：

/*溢出：隐藏隐藏页面上显示的滚动条*/
身体{
溢出：隐藏；
}
html{
背景：url（'http://pre15.deviantart.net/5686/th/pre/i/2016/338/6/2/living_tree_by_tacosauceninja-daqj4zz.jpg'）没有固定的重复中心；
背景尺寸：封面；
}
h1{
位置：绝对位置；
左：50%；
最高：50%；
转化：translateX（-50%）translateY（-50%）；
}
/*下面的代码是使条形图不可见的原因*/
#导航师{
不透明度：0.7；
滤镜：（不透明度=70）；
}
#纳夫迪夫酒店{
宽度：100%；
高度：80px；
背景#648DA0；
线高：80px；
颜色：白色；
文本对齐：居中；
}
#海军部{
文字装饰：无；
颜色：白色；
}
/*左边和右边的填充允许您在导航栏上选择每页之间的间距*/
#纳夫迪乌尔利酒店{
列表样式类型：无；
左侧填充：50px；
右边填充：50px；
显示：内联块；
浮动：中心；
}
#navdiv ul li:悬停{
背景#8FB0BF；
文本对齐：居中；
过渡：所有0.40秒；
}
#导航舱h1{
宽度：300px；
浮动：中心；
光标：指针；
左边距：15px；
}

主页
你好，世界。。。

那么您知道在LI中嵌套UL以制作下拉菜单吗

您需要在CSS中执行的操作是在子菜单中设置

display:none

，然后在用户将鼠标悬停在相应的li上时将其更改为

display:block

我添加了一个基本的代码片段，以尽可能简单地向您展示

ul{
列表样式类型：无；
}
/*隐藏子菜单*/
ul子菜单{
显示：无；
}
/*将鼠标悬停在li上时显示子菜单*/
li.下拉列表：悬停>ul{
显示：块；
}

谢谢！你的回答帮助很大。