在网页开发的过程中，折叠多选菜单是一种非常方便的工具。而在实现折叠多选菜单时，CSS是必不可少的一个工具。下面我们就来看一下如何利用CSS来实现一个简单的折叠多选菜单示例。

<div ><ul><li ><a href="">父级菜单1</a><ul ><li><a href="">子菜单1</a></li><li><a href="">子菜单2</a></li><li><a href="">子菜单3</a></li></ul></li><li ><a href="">父级菜单2</a><ul ><li><a href="">子菜单4</a></li><li><a href="">子菜单5</a></li><li><a href="">子菜单6</a></li></ul></li></ul></div>

首先，我们需要先设置一个包含所有菜单的div，并在其内部设置ul和li来实现菜单的嵌套结构。其中，每一个拥有子菜单的li需要设置为.parent类，而其内部的ul则需要设置为.children类。

.menu ul {list-style: none;padding: 0;margin: 0;}.menu .parent {position: relative;}.menu .children {display: none;position: absolute;top: 100%;left: 0;background-color: #fff;border: 1px solid #ccc;box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);padding: 10px;}.menu .parent:hover .children {display: block;}

接下来，我们需要设置CSS属性来实现折叠、伸展菜单的效果。其中，我们使用了position、display、top、left、background-color、border、box-shadow、padding等属性来实现菜单的基本样式。而当鼠标移到父级菜单上时，我们则需要将其内部的子菜单显示出来，这个效果可以通过设置.parent:hover .children的display属性为block来实现。

最后，我们只需要将上述两段CSS代码放在标签内部，并与HTML代码一起加入到页面中即可完成折叠多选菜单的示例。