html - @media 打印 XS 和 SM 屏幕尺寸的问题

Question

因此，每当页面为 XS 或 SM 尺寸时，我都会遇到问题。

我有一个打印样式应用于我的页面以进行打印，我在 @media print {}

中添加了这段代码

.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
     float: left!important;
}
.col-sm-12 {
     width: 100%;
}
.col-sm-11 {
     width: 91.66666667%;
}
.col-sm-10 {
     width: 83.33333333%;
}
.col-sm-9 {
     width: 75%;
}
.col-sm-8 {
     width: 66.66666667%;
}
.col-sm-7 {
     width: 58.33333333%;
}
.col-sm-6 {
     width: 50%;
}
.col-sm-5 {
     width: 41.66666667%;
}
.col-sm-4 {
     width: 33.33333333%;
}
.col-sm-3 {
     width: 25%;
}
.col-sm-2 {
     width: 16.66666667%;
}
.col-sm-1 {
     width: 8.33333333%;
}

每当我在 MD 或更高版本中打印时，一切看起来都很好，但一旦我点击 SM 及以下版本，所有内容都会缩小到页面的左上角。它看起来像这样:

无论如何，我可以解决此问题，以便无论屏幕尺寸如何，它始终以 MD 格式打印？

Answer 1

试试@page

@page CSS at 规则用于在打印文档时修改某些 CSS 属性。

@page{
margin:0mm;
}