Html 如何根据设备更改按钮大小？

我的网站上有一个按钮，当你通过手机访问它时，它会变得很小。我已经尝试了一些方法来解决这个问题，但是它们没有完成我的目标

#生成{
背景色：#FFAF19；
大纲：无；
边界：无；
颜色：白色；
边界半径：10px；
宽度：200px；
高度：50px；
字体系列：“CAB”，无衬线；
字体大小：粗体；
字体大小：25px；
位置：固定；
最高：50%；
左：50%；
利润上限：-50px；
左边距：-100px；
}
#生成：悬停{
过渡：.5s；
背景色：#e59d16；
盒影：0 12px 16px 0 rgba（0,0,0,0.24），0 17px 50px 0 rgba（0,0,0,0.19）；
}
#生成：活动{
转换：.1s；
背景色：#e59d16；
变换：translateY（4px）；
}
@媒体屏幕和屏幕（最小宽度：601px）{
#产生{
宽度：200px；
高度：50px；
}
}
@媒体屏幕和屏幕（最大宽度：600px）{
#产生{
宽度：200px；
高度：50px；
}
}

如果您想增大按钮的尺寸，则在较小的屏幕尺寸上，按钮的尺寸实际上需要不同。因此，在

@媒体屏幕和（最大宽度：600px）

中更改它

以下是一个例子：

#生成{
背景色：#FFAF19；轮廓：无；边框：无；颜色：白色；边框半径：10px；宽度：200px；高度：50px；字体系列：“CAB”，无衬线；字体重量：粗体；字体大小：25px；位置：固定；顶部：50%；左侧：50%；页边距顶部：-50px；页边距左侧：-100px；
}
#生成：悬停{
过渡：.5s；
背景色：#e59d16；
盒影：0 12像素16像素0 rgba（0,0,0,0.24），0 17像素50像素0 rgba（0,0,0,0.19）；
}
#生成：活动{
转换：.1s；
背景色：#e59d16；
变换：translateY（4px）；
}
@媒体屏幕和屏幕（最小宽度：601px）{
#产生{
宽度：200px；高度：50px；
}      
}
@媒体屏幕和屏幕（最大宽度：600px）{
#产生{
宽度：300px；高度：75px；
}
}

---

Generate

您是否已设置视口元数据-您的媒体查询是否生效？它们不起作用。是否有方法禁用自动缩放？有人告诉我你可以关闭一个CSS元素来自动调整页面大小。你的意思是这样的吗<代码>而你的想法行不通。我已经测试过了。然后我们需要更多的细节，以便任何人都能进一步帮助你。你想要网站链接吗？()