ajax里的css样式

AJAX是一种常用的前端技术，它能够使用户在不刷新页面的情况下与后台交互，让用户获得更好的体验。而CSS是前端开发中不可或缺的一部分，它可以让页面更加美观，并且实现一些交互效果。在AJAX中，我们也需要运用CSS来控制一些样式。

在AJAX刷新数据的时候，我们可能需要在新数据加载前给用户一些提示。比如说，我们可以使用一个加载动画来提示用户正在等待，或者使用一个文字提示用户加载完成。这些提示需要用CSS来实现。而在AJAX请求成功之后，我们需要更新页面上的某些内容。这些更新可能会导致样式的改变，我们也需要使用CSS来控制这些样式。

// AJAX请求前，添加一个loading动画
.loading {
   width: 50px;
   height: 50px;
   border-radius: 100%;
   margin: 50px auto;
   border: 5px solid rgba(0,.1);
   border-top-color: #7988a3;;
   animation: loading 1s infinite linear;
}
 
@keyframes loading {
   to {
      transform: rotate(360deg);
   }
}

// AJAX请求后，更新数据
.success {
   color: green;
   font-weight: 700;
}

.error {
   color: red;
   font-weight: 700;
}

如上面的代码所示，我们可以使用CSS来实现一个加载动画，并在AJAX请求后更新页面上的文字颜色和加粗程度。事实上，在AJAX中，我们可以使用CSS控制许多样式，比如：动画、背景、边框、颜色、字体、布局等等。只有掌握了对CSS的灵活使用，才能运用AJAX创造出更加丰富的用户体验。