如何使用CSS媒体查询让按钮在手机上显示,电脑上隐藏
您可以使用CSS媒体查询语句来实现这个功能。例如,您可以设置一个类名为'mobile-only'的按钮,并将其隐藏在电脑上,但在移动设备上显示出来:
<button class='mobile-only'>按钮</button>
<style>
.mobile-only {
display:none; /* 默认隐藏该按钮 */
}
@media only screen and (max-width: 768px) {
/* 小于等于768像素的移动设备显示该按钮 */
.mobile-only {
display:block;
}
}
</style>
这样在电脑上访问时,按钮会被隐藏起来,而在移动设备上访问时,按钮会显示出来。
原文地址: https://www.cveoy.top/t/topic/m1yx 著作权归作者所有。请勿转载和采集!