1.如果给电脑的CSS添加条件（media），那么在平板和手机上所有的样式都会消失，那么如果平板和手机上有和电脑上相同的样式也不能复用。
2.所以我们不要给电脑的css添加条件，这样无论浏览器的宽度是多少，电脑的CSS文件都会被执行，我们只需要在平板或者手机对应的CSS文件中通过相同的选择器覆盖掉不同的样式即可。
3.综上，可以降低代码的冗余。
4.企业开发中编写响应式网站的步骤
4.1、编写电脑版本的网页
4.2、编写平板版本的网页，通过相同的选择器覆盖掉不同的样式
4.3、编写手机版本的网页，通过相同的选择器覆盖掉不同的样式
最终编写为：
<!--电脑的CSS-->
<link rel="stylesheet" href="css/index.css">
<!--平板的CSS-->
<link rel="stylesheet" href="css/index-pad.css" media="screen and (max-width:1199px)">
<!--手机的CSS-->
<link rel="stylesheet" href="css/index-phone.css" media="screen and (max-width:768px)">