vue3使用ElementPlus的消息el-message样式不生效或者被遮盖（z-index）

解释：

在Vue 3中使用ElementPlus的<el-message>组件时，样式不生效或者被其他元素的z-index值遮盖，可能是由于以下原因：

1. 全局样式未正确加载：确保ElementPlus的样式文件已经被正确引入。
2. 组件的z-index被其他元素的z-index值超过：可能是因为你的消息组件的z-index值不够高，导致被其他元素遮盖。
3. 样式被Shadow DOM影响：如果你的项目中使用了Shadow DOM，可能会导致样式不生效或被覆盖。

解决方法：

1. 确认样式文件引入：检查是否正确引入了ElementPlus的样式文件。

   
   
   
   // main.js 或者 main.ts
   import 'element-plus/dist/index.css'

2. 调整z-index值：增加<el-message>组件的z-index值，确保它高于遮盖它的其他元素。

   
   
   
   .el-message {
     z-index: 9999 !important;
   }

3. 检查Shadow DOM：如果你的应用中使用了Shadow DOM，确保消息组件的样式没有被Shadow DOM隔离导致样式不生效。
4. 检查样式覆盖：使用开发者工具检查样式是否被其他选择器覆盖，并相应提高选择器优先级或修改被覆盖的样式。
5. 确认ElementPlus版本：确保你使用的ElementPlus版本与Vue 3兼容，并且是最新稳定版本。

如果上述方法都不能解决问题，可以考虑查看控制台是否有其他错误或警告信息，或者检查是否有其他全局样式冲突。