在Vue项目中，sonar 扫描前端 font-family: "iconfont" !important;报Unexpected missing generic font family该怎么解决

这个问题是由于 SonarQube 中含有一个名为 `Web:NoFallbackFont` 的规则，该规则要求所有字体族必须含有一个通用字体族（如 `sans-serif`、`serif`、`monospace` 等）。然而，在你的样式中，你使用的是一个非通用字体族 `iconfont`，所以会报出该错误。

为了解决这个问题，你可以将 `font-family` 属性的值修改为一个通用字体族，例如：

font-family: "iconfont", sans-serif !important;

这样就可以避免 SonarQube 报出 `Web:NoFallbackFont` 错误了。同时，你也可以考虑将 `!important` 关键字的使用减少，因为过多使用 `!important` 可能会导致样式难以维护。

相关问题

body .el-picker-panel { z-index: 1000002 !important; }和 .el-picker-panel { z-index: 1000002 !important; }

这两个CSS代码块的作用是设置一个指定选择器的层叠顺序（z-index）为1000002，并使用!important规则来确保它优先于其他可能存在的层叠顺序规则。具体来说，这些代码块是用于覆盖可能存在的默认层叠顺序或其他CSS样式（例如，使用具有更高优先级的!important规则设置的层叠顺序）。这样做通常是为了确保选择器的显示层级在其他元素上方，以达到更好的交互效果。这些代码可能用于特定的JavaScript库（例如Vue.js）或响应式框架（例如Element）中的日期选择器或弹出框等组件。

在nave中设置<view>标签的字体颜色没有生效<view style="color: red !important; font-size: 22px;">怎办

如果在nave中设置`<view>`标签的字体颜色仍然没有生效，可能是因为在全局样式中设置了该元素的样式，并且全局样式的优先级高于行内样式。

此时，你可以尝试使用`::deep`伪类选择器来强制覆盖全局样式。具体操作如下：

<view class="my-view">这是一段红色的文字</view>

/* 全局样式 */
.my-view {
  color: blue;
}

/* 局部样式 */
::deep .my-view {
  color: red !important;
  font-size: 22px;
}

在上面的代码中，我们使用了`::deep`伪类选择器来强制覆盖全局样式。这个伪类选择器可以让样式穿透组件，直接作用于组件内部的子元素。这样，在局部样式中设置`color: red !important`就可以强制覆盖全局样式，确保字体颜色可以正常生效。

需要注意的是，`::deep`伪类选择器是vue.js特有的语法，如果使用其他框架或者原生小程序开发，可能不支持该伪类选择器。