小编Rya*_*hur的帖子

关于stackoverflow的第一个问题,希望它不是太愚蠢.我一直试图想出一种方法来显示具有拆分事件日的日历.我想到的是使用内嵌css放置的SVG图形作为特定日历表格单元格的背景,以便分割具有拆分的日期.它在Firefox和Chrome中运行得非常好,但是图形不会显示在Internet Explorer中(我已经尝试过9和10但不是11).

首先使用javascript生成日历,并通过将css类添加到来自JSON数据的目标单元格来放置事件.

下面是一个用于应用背景的CSS类的小片段,完整的示例包含小提琴中的HTML:

    .calendar td {
      position:relative;
    }

    .calendar .split {
        background-repeat:no-repeat;
        background-position: top left;
        background-size: 100% 100%;
    }
    .calendar .split.am_vaca{ background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'  preserveAspectRatio='none'><polygon points='0,0 1,0 0,1' style='stroke-width:0; fill:lightgreen;' /></svg>");}

这是包含HTML和CSS的小提琴,用于说明问题:

• http://jsfiddle.net/0mspvexg/2/

在Firefox和Chrome中运行小提琴会正确显示分割日,但Internet Explorer 9,10(11？)不会显示分割天数.

我已经查看了类似的问题,如下所示,但尚未找到任何明确的解决方案:

1. IE9中的SVG背景图像
2. 内联SVG在IE中不能用作背景图像

任何人都有任何使用Internet Explorer以显示内联SVG作为背景的经验,或者看到一些我忽略的东西,或者我正在以错误的方式接近它.谢谢!