css - @media 使用 CSS 打印查询使我的打印机崩溃

Question

我有一个在线提交到电子邮件的表单，但有些人可能只想打印该页面。我在 CSS 中使用了@media 打印查询，当我尝试打印页面时，我的打印机打印了几行然后停止了。它说“无法将数据发送到打印机”。我应该完全尝试其他方法还是有办法使它起作用？有 JavaScript 验证，但如果我不尝试调整样式，页面打印正常，所以我认为这不是一个因素。如果不进行任何调整，打印需要两页，而且看起来不太好。

这是我的 CSS:

@media print {   
    .online {
        display: none;
    }
    .print {
        display: block;
    }
    .container {
        min-height: 0px;
    }
    .content {
        min-height: 0px;
        border: none;
        margin-bottom: 0px;
        -webkit-box-shadow: none;
                box-shadow: none;
    }
    nav {
        display: none;
    }
    .dance h3 {
        color: black;
        font-size: 18px;
    }
    .contact {
        padding: 20px 0 10px;
        border-top: 1px solid black;
        border-bottom: none;
        margin-bottom: 0px;
    }
    .item-bid {
        margin-bottom: 30px;  
    }
    fieldset {
        font-size: 12px;
        border: 1px solid black;
    }
    label {
        font-size: 12px; 
    } 
    input, textarea {
        display: none;
    }
    form p {
        font-size: 12px;
    }
    .description {
        padding-bottom: 100px;  
    }
}

Answer 1

如果您使用的是 Chrome，您可能希望通过打印对话框输出 PDF，并查看是否有任何明显的错误。