css 适配
https://blog.csdn.net/weixin_35467885/article/details/80778992
1、通过link方法
link方法引入媒体类型其实就是在标签引用样式的时候,通过link标签中的media属性来指定不同的媒体类型。这种方式引入媒体类型时常跟着引用的样式文件走,如下所示。
<!--手机端-->
<link rel="stylesheet" type="text/css" href="style_phone.css" media="screen and (max-width: 960px)"/>
<!--电脑端-->
<link rel="stylesheet" type="text/css" href="style_PC.css" media="screen and (min-width: 960px)"/>
2、使用@media
@media是CSS3中引进的一个特性,称为媒体查询,可以直接写在中间或者外部样式文件中。例如,查询媒体是否是屏幕,屏幕尺寸是否小于960px:
@media screen and (max-width: 960px){
/* 手机端CSS代码 */
}
@media screen and (min-width: 960px){
/* 电脑端CSS代码 */
}
以上就是最经典判断是电脑端还是手机端。
作者:NewSea 出处:http://newsea.cnblogs.com/
QQ,MSN:iamnewsea@hotmail.com 如无特别标记说明,均为NewSea原创,版权私有,翻载必纠。欢迎交流,转载,但要在页面明显位置给出原文连接。谢谢。 |