邊框半徑圓角未顯示在打印中

Question

我感興趣地閱讀了此鏈接

但這並沒有幫助我理解為什么邊框半徑問題沒有出現在印刷品上。

它們顯示在瀏覽器中，但不打印。

HTML

<div class="card">

    <div class = "qr">
    <div id ="qr1"></div>
    <?php echo $_POST["url"]; ?>
    <div id ="qr2"></div>
    <div id ="qr3"></div>
    <div id ="qr4"></div>

    </div>

    <div class = "desc">
    <div>Site title</div>
    <div><?php echo $_POST["titleText"] ?></div>
    <div>Hosting site</div>
    <div><?php echo $_POST["hostText"] ?></div>
    <div>Who made this site?</div>
    <div><?php echo $_POST["orgText"] ?></div>
    <div>Other information</div>
    <div><?php echo $_POST["commentText"] ?></div>
    </div>

</div>

CSS

.qr {
float:left;   
position: relative;
width: 30%;
}

.desc {
float:left;
width: 70%;
}

.card {
width: 100%;
position: relative;
border-top: 30px solid black;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border-radius: 20px;
padding: 5px;
}

我讀過的所有內容都表明我在做這項工作。 任何幫助我發現我錯過的東西將不勝感激。

Answer 1

邊框和HR被視為背景圖像，因此默認情況下不會與您的頁面一起打印。 如果要允許他們打印，則必須手動選擇打印頁面背景。

我不知道您在所有瀏覽器上都能找到此設置，但是我知道在Chrome瀏覽器中，該設置位於“打印”對話框中。 我會在其他瀏覽器中采用類似的位置。

---

在“ +更多設置”>“選項”下：