Question

我有简单的html + css页面用于打印目的。我有2列<div class="col col-left">和<div class="col col-right">，我也有<span class="tag">。我的风格如下：

<style type="text/css" media="all">
    ...
    .col {
        float: left;
        height: 1754px;
    }

    .col-left {
        width: 340px;
        background: #3a4d63;
        -webkit-print-color-adjust: exact;
        color: #fff;
    }

    .col-right {
        width: 880px;
        padding: 30px 10px;
    }

    span.tag {
        background: #00cca1;
        color: #fff;
        padding: 5px;
        border-radius: 5px;
        display: -webkit-inline-box;
        margin-top: 4px;
    }
    ...
<style>

我的html看起来像这样：

...
<div class="col col-left">
    <span class="tag">c#</span>
    <span class="tag">Javascript</span>
</div>
<div class="col col-right">
    <span class="tag">Angular</span>
    <span class="tag">TypeScript</span>
</div>
...

问题在于，当我尝试打印页面时，span.tag仅在.col-left内有背景颜色，但在.col-right内没有，相当很奇怪哈？

有什么想法吗？

Answer 1

我解决了将-webkit-print-color-adjust: exact;从.col-left移至.col

的问题

当我尝试打印页面时，CSS样式不适用于特定div中的跨度

1 个答案: