【问题标题】:HtmlRenderer doesn't render background image from cssHtmlRenderer 不会从 css 渲染背景图像
【发布时间】:2015-07-06 21:24:38
【问题描述】:

我使用HtmlRenderer 从 html 标记生成 jpg 图像。但是它不应用来自 css 的背景图片:

<div style="background:url(https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcTbNHtYU6bKKmxkJXlqDr7y7afZyZtw-WwDg6DoUNCb9nElkplEuw); width: 440px; height: 361px">
   Some content here.
</div>

这是 C# 代码:

String ecardHtml = File.ReadAllText("testWithGoodImage.html");
using (Image img = HtmlRender.RenderToImageGdiPlus(ecardHtml, maxWidth: 440, textRenderingHint: TextRenderingHint.AntiAliasGridFit))
{
    img.Save("result.jpg");
}

调试显示甚至没有请求该图像,所以我怀疑它不受支持。不过&lt;img&gt; 元素确实很好用。

所以问题是如何让它发挥作用。

我知道我可以在 HtmlRenderer 中的图像上渲染 html,但我只想在 html 代码中包含所有标记。

【问题讨论】:

标签: c# html css .net html-rendering


【解决方案1】:

HTML 渲染器支持背景图像 CSS,如果您真的希望
在 HTML 中完成它,那么这样的事情就可以完成:

<div style="width: 440px; height: 361px;position:relative">
    <div style="position:absolute;top:0;left:0;z-index:8888"><img src="https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcTbNHtYU6bKKmxkJXlqDr7y7afZyZtw-WwDg6DoUNCb9nElkplEuw"/></div>
    <div style="position:absolute;top:0;left:0;z-index:9999">Some content here.</div>       
</div>

或者只是添加背景图像而不仅仅是背景

<div style="background-image:url(https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcTbNHtYU6bKKmxkJXlqDr7y7afZyZtw-WwDg6DoUNCb9nElkplEuw); width: 440px; height: 361px">
   Some content here.
</div>

【讨论】:

  • 是否需要添加style属性?如果我们使用 css 文件呢?
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2017-04-26
  • 2016-07-13
  • 2014-11-30
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多