pc端前端页面适应不同分辨率的问题

<script  type="text/javascript">
if(window.screen.width>1427&&window.screen.width<=1920){  
   document.write("<link href='${ctx}/resources/css/party-service/party-self-building-css2.css' rel='stylesheet'>");  
}  
if(window.screen.width<=1427){  
   document.write("<link href='${ctx}/resources/css/party-service/party-self-building-css1.css' rel='stylesheet'>");  
}  

</script>

1,这里记住将此必须写在head中，这样样式才会先被加载出来，如果将此写在自己定义的js文件中，js文件写在body后面的话，样式将不会被按照预想的被显示出来

2,这种写法对于我现在的css样式中还是有问题的。注意查看自己css样式单是position是绝对定位absolute还是相对定位static,如果自己在页面中都是绝对定位的话，

这里的学时就不应该使用相对定位，如下代码显示：

@CHARSET "UTF-8";
.form-control  .unit-name-limit{
position: absolute;
    top: 0;
    right: 0;
    left:76%;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
}

这里的学习周期以及input输入框均用的是绝对定位，以及学时这个css一开始position也用的是绝对定位absolute,所以后面的left用百分比的形式就会导致不同分辨率的电脑显示出不一样的情况，写样式要瞻前顾后，这里根本不能用相对定位，所以也不存在适配不通分辨率电脑的问题。

正确样式应该这样写：

@CHARSET "UTF-8";
.form-control  .unit-name-limit{
position: absolute;
    top: 0;
    right: 0;
    left:580px;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
}