Question

我已经使用ReactJS开发了一个网站。当前，当我尝试打印此网站时，我遇到了问题，该徽标在第一次尝试时不存在。如果我关闭打印模式并再次尝试打印，它将起作用。我正在使用最新版本的chrome。

这是关于我的意思的gif图像。 https://s3.eu-central-1.amazonaws.com/jho/2019-05-08_06-46-25.gif

有人知道为什么会发生这种情况以及我该如何解决吗？

我已经在Chromedebugger中尝试使用CRTL + SHIFT + P来模拟CSS媒体类型。问题不会在这里发生！只是在使用STRG + P进行打印时。

在打印模式下，包含徽标的css代码如下所示：

.addOnPrint:before,
    div[data-section-name="Objektdetails"]:before,
    div[data-section-name="Galerie"]:before,
    div[data-section-name="Galerie "]:before,
    div[data-section-name="Über die Immobilie"]:before,
    div[data-section-name="Umfeld der Immobilie"]:before,
    div[data-section-name="Angaben zum Energieausweis"]:before,
    div[data-section-name="Kontakt"]:before,
    div[data-section-name="Cover"]:before
    {
        content: "";
        width: 100px !important;
        height: 70px;
        margin-top: 10px;
        background-image: url(xxx);
        background-repeat: no-repeat;
        display: block;
        position: absolute;
        z-index: 1;
    }

以下是一个代码框示例：https://codesandbox.io/s/5y4j4oxkvp

首次尝试打印网站时，打印屏幕上缺少元素

0 个答案: