如何移除Flutter中flutter_html组件的默认水平内边距

flutter_html 组件默认会给 <html>、<body>、<p> 等内置HTML标签预设外边距和内边距，你可以通过自定义标签样式覆盖默认配置，即可移除多余的水平内边距：

2.x 版本示例代码 #

HTML(
  data: "你需要解析的HTML文本内容",
  style: {
    "html": Style(
      margin: Margins.zero,
      padding: HtmlPaddings.zero,
    ),
    "body": Style(
      margin: Margins.zero,
      padding: HtmlPaddings.zero,
    ),
    "p": Style(
      margin: Margins.zero,
      padding: HtmlPaddings.zero,
    ),
    // 其他用到的标签存在默认边距时，可参照上述格式添加配置
  },
)

3.x 及以上版本示例代码 #

3.0+版本API调整了边距相关类名，代码修改为：

HTML(
  data: "你需要解析的HTML文本内容",
  style: {
    "html": Style(
      margin: Margin.zero,
      padding: Padding.zero,
    ),
    "body": Style(
      margin: Margin.zero,
      padding: Padding.zero,
    ),
    "p": Style(
      margin: Margin.zero,
      padding: Padding.zero,
    ),
  },
)

如果配置后仍存在边距，可检查你解析的HTML内容里用到的其他标签（比如ul、li、div等），针对性为对应标签添加零边距样式即可。

内容的提问来源于stack exchange，提问作者Mihail Iliev