我希望防止智能手机和平板电脑上出现一系列动画。我能想到的最简单的解决方案是将这些动画 CSS 移动到单独的样式表中,并以某种方式阻止该样式表加载到所有智能手机和平板电脑中。
我怎样才能做到这一点?
更新:
- 请不要使用针对屏幕宽度的媒体查询(这远非精确,因为某些平板电脑与某些笔记本电脑一样宽)。
- 解决触控设备问题是我可以接受的解决方案,虽然并不完美,因为某些笔记本电脑具有此功能。
- 我认为理想的解决方案是解决移动浏览器和操作系统问题。
Best Answer-推荐答案 strong>
您可以在 CSS http://www.w3schools.com/cssref/css3_pr_mediaquery.asp 中使用媒体查询
例如:
@media only screen and (max-width:991px){
/*insert here all the css you want to be load ONLY on devices below 991px*/
}
如果你想将你的 CSS 分成两张表,那么你可以在 标记中进行设置:
<link href="exmaple.css" media="(min-width: 991px)" rel="stylesheet" type="text/css" />
编辑:
在您的情况下,一种选择是设置这样的媒体查询:
@media only screen and (min-width:1200px){
/*insert here those CSS animations.*/
/*they will only take effect on devices above 1200px*/
}
当然,您可以设置任何分辨率并根据需要使用 min-width 和 max-width。
关于android - 如何防止在移动设备中加载样式表,我们在Stack Overflow上找到一个类似的问题:
https://stackoverflow.com/questions/30504761/
|