css - 可以连接打印机的设备的媒体查询

标签 css printing media-queries mobile-website

我正在构建一个具有“导出”按钮的站点,该按钮稍微重新排列页面然后启动“打印”对话框。它允许桌面用户打印页面或将页面另存为 PDF。

但是,我们也有移动用户。在移动设备上,该按钮毫无意义:移动浏览器(据我所知)甚至没有打印功能。

如何在移动设备上使用媒体查询(或类似查询)隐藏按钮?最安全的选择似乎是检测操作系统,如果是 Android、iOS 或类似系统则将其隐藏?

最佳答案

只要使用这个媒体查询按钮就会在767px之后隐藏 您还可以根据需要更改视口(viewport)

@media screen and (max-width:767px){
#print-my-data{
display:none;
}
}
<button id="print-my-data">Print</button>

关于css - 可以连接打印机的设备的媒体查询,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55214691/

相关文章:

CSS,div 后面的菜单

html - Chrome 和 Firefox/IE 之间的间距问题

c - 在 C 中打印矩阵时遇到问题

html - 媒体查询不会调整字段集和按钮的大小

css - IE9 在加载非外部 CSS 时加载了错误的媒体查询信息

css - Bootstrap 3 - 使列内的 div 与同一行上的其他列高度相同。

html - 不能在页脚中 float 链接吗?

html - 当打印多于一页时,它会在两页之间打断表格

arrays - 在 Ruby 中一行打印数组元素

css - 无法让我的 css 媒体查询与 Bootstrap 一起使用