如何在flutter_html中加载并使用外部CSS类？

不用WebView完全没问题，flutter_html本身就支持把自定义样式映射到HTML的class上，直接按下面的方式实现：

• 先定义样式集合，把text-right类对应到Flutter的Style属性：

final customClassStyles = {
  "text-right": Style(
    textAlign: TextAlign.right,
    // 还能添加其他样式属性，比如字体大小、颜色等
    // fontSize: FontSize(15),
    // color: Colors.blueGrey,
  ),
};

• 接着在Html组件中，通过style.classes传入这个样式集合即可：

Html(
  data: '<p class="text-right">Supposed to be following text-right styles</p>',
  style: Style(
    classes: customClassStyles,
  ),
)

如果需要给特定标签的该类设置更精准的样式（比如仅对p标签的text-right生效），可以这么写：

final customClassStyles = {
  "p.text-right": Style(
    textAlign: TextAlign.right,
    fontWeight: FontWeight.w600,
  ),
};

这样HTML里的<p class="text-right">就会自动应用你定义的右对齐（以及加粗）样式了。

内容的提问来源于stack exchange，提问作者Naufal Rajabi