CSS 下拉菜单
-
基本下拉列表
创建一个下拉框,当用户将鼠标移到元素上时会出现该下拉框。
示例说明:
HTML使用任何元素打开下拉内容,例如<span>或<button>元素。使用容器元素(如<div>)创建下拉内容并在其中添加任何内容。在元素周围包裹<div>元素,以使用CSS正确定位下拉内容。
CSS)的.dropdown类使用position:relative,当我们要下拉的内容要放在正下方的下拉按钮(使用这是需要position:absolute)。.dropdown-content类保存实际下拉内容。它默认是隐藏的,并将在悬停时显示(见下文)。请注意,min-width它设置为160px。随意改变这一点。提示:如果您希望下拉内容的宽度与下拉按钮一样宽,请将其设置width为100%(并用overflow:auto在小屏幕上启用滚动)。我们使用CSS box-shadow属性使下拉菜单看起来像“卡片” ,而不是使用边框。:hover选择器被用来显示在下拉菜单中,当用户在该下拉按钮移动鼠标。 -
-
相关页面
HTML教程:HTML样式