.menu li:hover .m_show{display: block;}
<!DOCTYPE HTML>
<html>
<meta http-equiv="Content-type" content="text/html;charset=utf-8"> <!--声明页面类型为html 声明该页面的字符集为utf-8（国际编码）-->
<title>左侧目录</title> <!--页面唯一标题标签-->
<meta name="keywords" content=""> <!--页面关键字声明-->
<meta name="description" content=""> <!--页面描述信息声明-->
<style>
*{margin: 0;padding: 0;font-family: "微软雅黑";font-size: 14px;color: #fff;font-weight: normal;}
body{background: #4D4C9A;}
a{text-decoration: none;}
.menu{background: #188EEE;width: 225px;margin: 100px;height:390px;}
.menu li{list-style: none;line-height: 30px;border-top: 1px solid #fff;padding: 10px 20px 20px 20px;width: 185px; height: 50px;position: relative;float: left;}
.menu li h1 a{font-size: 18px;}
.menu li:hover{background: #09699C;}
.menu li:hover .m_show{display: block;}
.menu li.m_all{border: none;line-height: 40px;padding-bottom: 5px;}
.menu li.m_all:hover{background: #188EEE;}
.menu li.m_all:hover h1 a{text-decoration: underline;}
.menu li .m_show{background:#F7F7FA;position: absolute;top:0;left:225px;width: 425px;display: none;}
.menu li .m_show .show_list{width: 400px;height: 100px;margin-left: 20px;border-bottom: 1px solid #E5E5E5;}
.menu li .m_show .show_list p a{display: block;float: left;width: 80px;height: 90px;font-size: 16px;color: #188EEE;font-weight: bold;margin-top: 10px;}
.menu li .m_show .show_list .show_icon{float: left;width: 300px;}
.menu li .m_show .show_list .show_icon a{display: block;float: left;margin: 8px;color: #000;}
.menu li .m_show .show_list .show_icon a:hover{color:#188EEE; }
.clear{clear: both;}
</style>
<body>
<div class="menu">
<ul>
<li class="m_all">
<h1><a href="#">全部课程</a></h1>
</li>
<li>
<h1><a href="#">职业技能</a></h1>
<h2>
<a href="#">职业技能</a>
<a href="#">公务员</a>
<a href="#">SNS营销员</a>
</h2>
<div class="m_show">
<div class="show_list">
<p><a href="#">职场/求职</a></p>
<div class="show_icon">
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
</div>
</div>
<div class="show_list">
<p><a href="#">职场/求职</a></p>
<div class="show_icon">
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
</div>
</div>
<div class="show_list">
<p><a href="#">职场/求职</a></p>
<div class="show_icon">
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
</div>
</div>
</div>
</li>
<li>
<h1><a href="#">职业技能</a></h1>
<h2>
<a href="#">职业技能</a>
<a href="#">公务员</a>
<a href="#">SNS营销员</a>
</h2>
<div class="m_show">
<div class="show_list">
<p><a href="#">职场/求职</a></p>
<div class="show_icon">
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
</div>
</div>
<div class="show_list">
<p><a href="#">职场/求职</a></p>
<div class="show_icon">
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
</div>
</div>
<div class="show_list">
<p><a href="#">职场/求职</a></p>
<div class="show_icon">
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
</div>
</div>
</div>
</li>
<li>
<h1><a href="#">职业技能</a></h1>
<h2>
<a href="#">职业技能</a>
<a href="#">公务员</a>
<a href="#">SNS营销员</a>
</h2>
<div class="m_show">
<div class="show_list">
<p><a href="#">职场/求职</a></p>
<div class="show_icon">
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
</div>
</div>
<div class="show_list">
<p><a href="#">职场/求职</a></p>
<div class="show_icon">
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
</div>
</div>
<div class="show_list">
<p><a href="#">职场/求职</a></p>
<div class="show_icon">
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
</div>
</div>
</div>
</li>
<li>
<h1><a href="#">职业技能</a></h1>
<h2>
<a href="#">职业技能</a>
<a href="#">公务员</a>
<a href="#">SNS营销员</a>
</h2>
<div class="m_show">
<div class="show_list">
<p><a href="#">职场/求职</a></p>
<div class="show_icon">
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
</div>
</div>
<div class="show_list">
<p><a href="#">职场/求职</a></p>
<div class="show_icon">
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
</div>
</div>
<div class="show_list">
<p><a href="#">职场/求职</a></p>
<div class="show_icon">
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
<a href="#">就业指导</a>
</div>
</div>
</div>
</li>
</ul>
</div>
</body>
</html>