css对打印的支持

1. 我们可以通过 链接两个外部样式来控制 页面打印时的样式 和 显示样式。
   如：

<link rel="stylesheet" href="lighthouse.css" media="screen">
<link rel="stylesheet" href="lighthouseprint.css" media="print">

2.在移动设备上可以通过

<meta name="viewport" content= "width=device-width. initial-scale = 1.0">

控制显示
user-scalable 禁止缩放。
3.css3媒体查询
如
1)

<link href="aaa.css" rel = "stylesheet" media="only screen and (max-width: 480px) and (min-width: 256px)">

2)第二种方法是：使用@media直接在css文件中声明

@media only screen and (max-width: 480px) {
	.sdfdsfdsf{
		display: flex;
	}
	.test {
		display:flex;
	}
}

3. picture元素
   能够在分辨率不同的时候选择不同大小的图片

<picture>
	<source media="(min-width: 1200px)" srcset="large.jpg">
	<source media="(min-width: 800px)" srcset="middle.jpg">
	<source media="(min-width: 480px)" srcset="small.jpg">
	<img src="fallback.jpg" alt="waterwheel">
</picture>

4.img 元素也可以

<img  src="fallback.jpg" sizes="100vw" srcset="large.jpg 1200w, medium.jpg 800w, small.jpg 320w" 
	alt="waterwheel"
>