4

我试图使用 box-shadow 作为默认情况下不打印的背景颜色的解决方法......看起来这种解决方法在 Chrome 和 Safari 中有效，但在 IE8/9/10 中无效。只是想与其他人确认是这样的。

这是代码：

@media print {

    #fusioncolor {
        background-color: transparent;
        -webkit-print-color-adjust: exact;
    }

    #fusioncolor .bg1 {
        box-shadow: inset 0 0 0 1000px #AFD8F8;
    }

    #fusioncolor .bg2 {
        box-shadow: inset 0 0 0 1000px #F6BD0F;
    }

    #fusioncolor .bg3 {
        box-shadow: inset 0 0 0 1000px #8BBA00;
    }

    #fusioncolor .bg4 {
        box-shadow: inset 0 0 0 1000px #FF8E46;
    }

}


<table cellspacing="1" cellpadding="10" id="fusioncolor">

                <tr style="cursor: pointer" onClick="showOpens(true)" onmouseover="style.backgroundColor='#E8F2FE'" onmouseout="style.backgroundColor=''">
                    <td align="right" class="big fgGrey l6e">opened</td>
                    <td width="50px" class="big box gl8t bg1" id="id-opened" turntitle="Opens">&nbsp;</td>
                    <td align="left" id="id-openedpct"></td>
                </tr>
                <tr style="cursor: pointer" onClick="showBounces()" onmouseover="style.backgroundColor='#E8F2FE'" onmouseout="style.backgroundColor=''">
                    <td align="right" class="big fgGrey l6e">bounced</td>
                    <td class="big box gl8t bg2" id="id-bounced"    title="Bounces">&nbsp;</td>
                    <td align="left" id="id-bouncedpct"></td>
                </tr>
                <tr style="cursor: pointer" onClick="showNoOpens()" onmouseover="style.backgroundColor='#E8F2FE'" onmouseout="style.backgroundColor=''">
                    <td align="right" class="big fgGrey nobr l6e">did not open</td>
                    <td class="gl8t big box bg3" id="id-notopened"  title="No Opens / No Responses">&nbsp;</td>
                    <td align="left" id="id-notopenedpct"></td>
                </tr>
                <tr style="cursor: pointer" onClick="clicksDrillDown('', $('id-clicked').innerHTML.replace(/,/g,''), true)" onmouseover="style.backgroundColor='#E8F2FE'" onmouseout="style.backgroundColor=''">
                    <td align="right" class="big fgGrey l6e">clicked</td>
                    <td class="big box gl8t bg4" id="id-clicked"    title="Unique Clicks">&nbsp;</td>
                    <td align="left" id="id-clickedpct"></td>
                </tr>

            </table>

这是一个没有 CSS 打印媒体查询的 JSFiddle 链接：http: //jsfiddle.net/RNKJN/

4

1 回答 1

1

IE 不支持框阴影，除了ie9+

如果你给前缀-ms它可以在最新的 IE 版本中工作

box-shadow: inset 0 0 0 1000px #F6BD0F;

-ms-box-shadow: inset 0 0 0 1000px #F6BD0F;
于 2013-10-24T19:42:49.467 回答