对不同设备的背景进行了css的适配

原先在笔记本和台式机上，惠惠的那个背景经常是不能完全显示出来的，只能显示出来半个身子，但是在手机上看我的博客又是非常完美的......
所以说我采用了因人而治的手法，对不同设备进行了不同的背景设置：

/* 检测用户是否使用移动设备 */  
    @media only screen and (max-width: 767px) {  
      /* 改变样式 */  
    body {  
        background-image: url(https://img1.imgtp.com/2023/05/01/mhyoOtKF.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center ;
        background-attachment: fixed; 
    }   
    .mt-auto:after {
        content: "您当前采用“手机端”打开此网页";
        font-style: italic;
        font-weight: bolder; 
        color: wheat;
}
}
/* 检测用户是否使用台式电脑 */  
    @media only screen and (min-width: 768px) and (max-width: 991px) {  
      /* 改变样式 */  
    body {  
        background-image: url(https://img1.imgtp.com/2023/05/01/EiUP9R8D.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center ;
        background-attachment: fixed; 
    } 
    .mt-auto:after {
        content: "您当前采用“台式电脑”打开此网页";
        font-style: italic;
        font-weight: bolder; 
        color: wheat;
}
}
  
/* 检测用户是否使用笔记本电脑 */  
    @media only screen and (min-width: 992px) {  
      /* 改变样式 */  
    body {  
        background-image: url(https://img1.imgtp.com/2023/05/01/EiUP9R8D.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center ;
        background-attachment: fixed; 
    }  
    .mt-auto:after {
        content: "您当前采用“笔记本电脑”打开此网页";
        font-style: italic;
        font-weight: bolder; 
        color: wheat;
}
}