element .el-pagination兼容移动端

element-ui 的 el-pagination 组件默认是为桌面端设计的，但是在移动端也可以使用。为了更好的适应移动端，可以通过以下方式进行样式调整和优化：

1. 设置 el-pagination 的 size 属性为 small，以减小分页组件的大小。
2. 通过设置 el-pagination 的 layout 属性，来隐藏一些在移动端不需要的元素，例如：total、page-sizes、pager-count 等。
3. 通过设置 el-pagination 的 background-color 属性，来调整分页组件的背景色，以适应移动端的设计风格。
4. 设置 el-pagination 的 margin 和 padding 属性，来调整分页组件与周围元素之间的间距，以适应移动端的页面布局。

一个示例代码如下：

<el-pagination
  :current-page="currentPage"
  :page-size="pageSize"
  :total="total"
  :page-count="pageCount"
  :layout="layout"
  :background-color="backgroundColor"
  :size="size"
></el-pagination>

<style>
/* 移动端样式优化 */
@media screen and (max-width: 767px) {
  .el-pagination {
    margin: 10px 0;
    padding: 10px;
  }
}
</style>

<script>
export default {
  data() {
    return {
      currentPage: 1,
      pageSize: 10,
      total: 100,
      pageCount: 10,
      layout: 'prev, pager, next',
      backgroundColor: '#f0f0f0',
      size: 'small'
    }
  }
}
</script>