[分享]css分辨率和js文件

CSS分辨率是指屏幕或设备像素的密度，通常用px表示。在不同的设备上，像素密度也会不同，这样就会导致相同尺寸的元素在不同设备上显示的大小也不同。为了解决这个问题，可以使用css中的媒体查询来针对不同的...

CSS分辨率是指屏幕或设备像素的密度，通常用px表示。在不同的设备上，像素密度也会不同，这样就会导致相同尺寸的元素在不同设备上显示的大小也不同。为了解决这个问题，可以使用css中的媒体查询来针对不同的设备设置不同的样式。

@media screen and (max-width: 768px) {
  #foo {
    font-size: 14px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
  #foo {
    font-size: 16px;
  }
}
@media screen and (min-width: 1024px) {
  #foo {
    font-size: 18px;
  }
} 

而对于JavaScript文件，一般需要通过script标签引入。在引入之前，需要注意文件的位置和加载顺序。如果某个js文件依赖于另一个js文件，则需要先引入依赖文件，否则将会报错。同时，使用async或defer属性可以使js文件在页面加载完毕后再执行，从而提高页面的加载速度。

<script src="jquery.js" defer></script>
<script src="main.js" async></script> 

使用好CSS分辨率和JavaScript文件加载技巧可以使网站更加优化，提高用户体验。