link标签引入css样式文件:适配不同屏幕

版权声明:本文为博主原创文章,允许转载,但转载必须注明出处并附带首发链接 https://blog.csdn.net/qq_35393869/article/details/88345500

link标签引入css样式文件:适配不同屏幕

参考博客:https://blog.csdn.net/nianzhi1202/article/details/52464078


如下:
当只使用min_width或则max_width时;我们用min-width时,小的放上面大的在下面,同理如果是用max-width那么就是大的在上面,小的在下面,顺序不能混淆。例如:


	@media (min-width: 768px){ //>=768的设备 }
	@media (min-width: 992px){ //>=992的设备 }
	@media (min-width: 1200){ //>=1200的设备 }
	

当然在很多情况下都是混合使用;例如


	@media screen and (min-width: 960px) and (max-width: 1199px) { 
		#page{ width: 960px; }
		#content,.div1{width: 650px;}
		#secondary{width:250px}
		select{max-width:200px}
	 }

还有一种方法是我不常使用的:


<link rel="stylesheet" type="text/css" href="style.css" media="screen and (min-width: 600px) and (max-width: 800px)">


意思是当屏幕的宽度大于600小于800时,应用style.css文件设置样式


以上就是关于 “ link标签引入css样式文件:适配不同屏幕 ” 全部内容。

猜你喜欢

转载自blog.csdn.net/qq_35393869/article/details/88345500