边框半径圆角在打印时不显示

Question

我感兴趣地阅读this link

但这并没有帮助我理解为什么边界半径问题不会出现在打印上。

它们显示在浏览器中，但不打印。

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中，该设置位于打印对话框中。我会在其他浏览器中假设一个类似的位置。

---

在“+更多设置”下＆gt; “选项”：