Laravel框架自定义分页样式操作示例


Posted in PHP onJanuary 26, 2020

本文实例讲述了Laravel框架自定义分页样式操作。分享给大家供大家参考,具体如下:

操作步骤如下:

(1)  对应public/css/paging.css 文件建立分页样式.

(2)  控制器查出分页数据使用 paginate函数进行分页处理.(禁止使用group by处理查询).

(3) 对应视图引入分页样式.

例如: paging.css 样式文件代码(复制即可用,实际操作过)如下

#pull_right{
    text-align:center;
  }
  .pull-right {
    /*float: left!important;*/
  }
  .pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px;
  }
  .pagination > li {
    display: inline;
  }
  .pagination > li > a,
  .pagination > li > span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #428bca;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd;
  }
  .pagination > li:first-child > a,
  .pagination > li:first-child > span {
    margin-left: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
  }
  .pagination > li:last-child > a,
  .pagination > li:last-child > span {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
  }
  .pagination > li > a:hover,
  .pagination > li > span:hover,
  .pagination > li > a:focus,
  .pagination > li > span:focus {
    color: #2a6496;
    background-color: #eee;
    border-color: #ddd;
  }
  .pagination > .active > a,
  .pagination > .active > span,
  .pagination > .active > a:hover,
  .pagination > .active > span:hover,
  .pagination > .active > a:focus,
  .pagination > .active > span:focus {
    z-index: 2;
    color: #fff;
    cursor: default;
    background-color: #428bca;
    border-color: #428bca;
  }
  .pagination > .disabled > span,
  .pagination > .disabled > span:hover,
  .pagination > .disabled > span:focus,
  .pagination > .disabled > a,
  .pagination > .disabled > a:hover,
  .pagination > .disabled > a:focus {
    color: #777;
    cursor: not-allowed;
    background-color: #fff;
    border-color: #ddd;
  }
  .clear{
    clear: both;
  }

例如:TestCntroller.php 控制器示例写法

<?php
namespace App\Http\Controllers;
use Illuminate\Support\Facades\DB;
use App\Http\Controllers\Controller;
class TestController extends Controller{
  /**
   * 测试数据
   */
  public function index()
  {
    $test = DB::table('test')->paginate(5);
    return view('index', ['test' => $test]);
  }
}

例如: list.blade.php 视图文件代码示例写法

<!--用于引用css-->
<link rel="stylesheet" type="text/css" href="{{asset('css/paging.css')}}" rel="external nofollow" />
<div class="container">
  <!--查数据-->
  @foreach ($test as $value)
    {{ $value->id }}
  @endforeach
</div>
<div id="pull_right">
  <!--分页写法-->
  <div class="pull-right">
    {{ $test->render() }}
  </div>
</div>

样式如下图:

Laravel框架自定义分页样式操作示例

希望本文所述对大家基于Laravel框架的PHP程序设计有所帮助。

PHP 相关文章推荐
在php MYSQL中插入当前时间
Apr 06 PHP
PHP下一个非常全面获取图象信息的函数
Nov 20 PHP
php中全局变量global的使用演示代码
May 18 PHP
php cookie使用方法学习笔记分享
Nov 07 PHP
yii实现创建验证码实例解析
Jul 31 PHP
PHP树的深度编历生成迷宫及A*自动寻路算法实例分析
Mar 10 PHP
php处理json格式数据经典案例总结
May 19 PHP
ThinkPHP5 验证器的具体使用
May 31 PHP
PHP集成环境XAMPP的安装与配置
Nov 13 PHP
CI框架网页缓存简单用法分析
Dec 26 PHP
Laravel 队列使用的实现
Jan 08 PHP
Laravel获取当前请求的控制器和方法以及中间件的例子
Oct 11 PHP
php数组函数array_push()、array_pop()及array_shift()简单用法示例
Jan 26 #PHP
php的instanceof和判断闭包Closure操作示例
Jan 26 #PHP
yii2.0框架场景的简单使用示例
Jan 25 #PHP
laravel框架实现为 Blade 模板引擎添加新文件扩展名操作示例
Jan 25 #PHP
laravel框架模型和数据库基础操作实例详解
Jan 25 #PHP
laravel框架分组控制器和分组路由实现方法示例
Jan 25 #PHP
laravel框架中间件简单使用方法示例
Jan 25 #PHP
You might like
ie6 动态缩略图不显示的原因
2009/06/21 PHP
深入php define()函数以及defined()函数的用法详解
2013/06/05 PHP
测试php连接mysql是否成功的代码分享
2014/01/24 PHP
User Scripts: Video Download by User Scripts
2007/05/14 Javascript
获取服务器传来的数据 用JS去空格的正则表达式
2012/03/26 Javascript
定时器(setTimeout/setInterval)调用带参函数失效解决方法
2013/03/26 Javascript
javascript列表框操作函数集合汇总
2013/11/28 Javascript
JS实现自动阅读单词(有道单词本添加功能)
2016/11/14 Javascript
jQuery实现一个简单的轮播图
2017/02/19 Javascript
JQ中$(window).load和$(document).ready区别与执行顺序
2017/03/01 Javascript
Bootstrap布局之栅格系统学习笔记
2017/05/04 Javascript
vue中component组件的props使用详解
2017/09/04 Javascript
使用Vue开发动态刷新Echarts组件的教程详解
2018/03/22 Javascript
详解.vue文件中style标签的几个标识符
2018/07/17 Javascript
es6数据变更同步到视图层的方法
2019/03/04 Javascript
js中async函数结合promise的小案例浅析
2019/04/14 Javascript
Node.js+Vue脚手架环境搭建的方法步骤
2020/03/08 Javascript
JS实现京东商品分类侧边栏
2020/12/11 Javascript
[07:01]DOTA2-DPC中国联赛正赛 Aster vs Magma 3月5日 赛后选手采访
2021/03/11 DOTA
django数据库migrate失败的解决方法解析
2018/02/08 Python
Python实现爬虫爬取NBA数据功能示例
2018/05/28 Python
tensorflow: 查看 tensor详细数值方法
2018/06/13 Python
Python用dilb提取照片上人脸的示例
2020/10/26 Python
HTML5之WebGL 3D概述(上)—WebGL原生开发开启网页3D渲染新时代
2013/01/31 HTML / CSS
德国婴儿推车和儿童安全座椅商店:BABYSHOP
2016/09/01 全球购物
The North Face北面法国官网:美国著名户外品牌
2019/11/01 全球购物
What is the purpose of Void class? Void类的作用是什么?
2016/10/31 面试题
个人求职信范文分享
2013/12/13 职场文书
上班看电影检讨书
2014/02/12 职场文书
企业活动策划方案
2014/06/02 职场文书
销售人员工作自我评价
2014/09/21 职场文书
政府四风问题整改措施
2014/10/04 职场文书
学习十八届四中全会精神思想汇报
2014/10/23 职场文书
退货证明模板
2015/06/23 职场文书
解析CSS 提取图片主题色功能(小技巧)
2021/05/12 HTML / CSS
简单总结SpringMVC拦截器的使用方法
2021/06/28 Java/Android