使用 CSS 创建菜单没问题。
但是如何使创建的菜单不飘出边界？
就是说，例如桌面上的右键菜单一样。当你在最右边弹开时，因为已经在最右边了，菜单无法显示，所以菜单会向左偏移。在最底面显示时，会向上偏移。
具体点的效果如下：（蓝色表示页面，红色表示菜单的头，黄色表示菜单）
当菜单不足以飘出边界时，以头的左侧为基准。（JSFiddle）
当不变更样式时，菜单宽度超过边界时的错误效果。（JSFiddle）
通过变更样式，显示想要的正确效果。（JSFiddle）
如上所述，最后是通过修改了样式才有想要的效果。那么是否 CSS3 可以有其他解决方案呢？
2016-6-25 16:00:53 更新
简单重述一下：我的意思是根据菜单（黄色）的宽度来决定定位。在桌面的屏幕最右边点击右键菜单不会显示在屏幕外，而是向左弹出，在最左面是向右弹出。类似这种效果
flex 的justify-content: flex-end可以，根据情况用吧，个人觉得还用定位好