之前写过elementUI抽屉没有蒙层后底部可点击的情况，现在要写的是el-dialog底部没有蒙层且可以点击的情况。本想着是也跟抽屉的样式类似来处理，但是发现dialog的宽度和高度不好控制就放弃了，去寻找了其他的方法
一：寻找解决办法
当时想着既然宽高不能处理，那么css有没有这种属性可以直接处理呢，就去菜鸟教程中需寻找了。在css手册中找到了一个属性pointer-events，表示的是设置元素是否对鼠标事件做出反应。
默认值是none/auto。属性值包含以下几种。
当时想着这个应该可以解决问题，因为是把蒙版去了，但是点击没有反应的情况，所以就尝试处理了一下。
二：处理方式
处理上应该要有区别，因为最外层的dialog的标签的pointer-events的值肯定是要为none的。
主要dialog标签里的要怎么处理既能点击dialog窗口里的内容又不影响外侧的页面的点击。
这是实例的内容，关于实例也有比较清楚的描述。
visiblePainted
只适用于 SVG，元素只有在以下情况才会成为鼠标事件的目标：
- visibility 属性值为 visible，且鼠标指针在元素内部，且 fill 属性指定了 none 之外的值
- visibility 属性值为 visible，鼠标指针在元素边界上，且 stroke 属性指定了 none 之外的值
visibleFill
只适用于 SVG，只有在元素 visibility 属性值为 visible，且鼠标指针在元素内部时，元素才会成为鼠标事件的目标，fill 属性的值不影响事件处理。
visibleStroke
只适用于 SVG，只有在元素 visibility 属性值为 visible，且鼠标指针在元素边界时，元素才会成为鼠标事件的目标，stroke 属性的值不影响事件处理。
visible
只适用于 SVG，只有在元素 visibility 属性值为 visible，且鼠标指针在元素内部或边界时，元素才会成为鼠标事件的目标，fill 和 stroke 属性的值不影响事件处理。
painted
只适用于 SVG，元素只有在以下情况才会成为鼠标事件的目标：
- 鼠标指针在元素内部，且 fill 属性指定了 none 之外的值
- 鼠标指针在元素边界上，且 stroke 属性指定了 none 之外的值
visibility 属性的值不影响事件处理。
fill
只适用于 SVG，只有鼠标指针在元素内部时，元素才会成为鼠标事件的目标，fill 和 visibility 属性的值不影响事件处理。
stroke
只适用于 SVG，只有鼠标指针在元素边界上时，元素才会成为鼠标事件的目标，stroke 和 visibility 属性的值不影响事件处理。
all
只适用于 SVG，只有鼠标指针在元素内部或边界时，元素才会成为鼠标事件的目标，fill、stroke 和 visibility 属性的值不影响事件处理。
看完描述后就尝试处理了一下，
最外层的dialog标签属性pointer-events:none，
dialog里面设置的class中将pointer-events:all,功能就实现了。
dialog标签上的class设置
三：总结
功能实现了之后发现了css也是不简单的，很多东西都得去学习的。虽然添加的东西不是很多，但是也算是攻克了一个对我来说是一个问题的功能。记录学习一下。
