本站分页代码展示

本站分页代码展示：

PHP分页类代码：

    // === 分页 ===

    public static function pagination($currentPage, $totalPages, $baseUrl, $paramName = 'page', $cssClass = 'pagination') {
        if ($totalPages <= 1) return '';
        $html = '<div class="' . $cssClass . '">';
        // 数字页码范围
        $start = max(1, $currentPage - 2);
        $end = min($totalPages, $currentPage + 2);
        // 首页（仅当首页不在数字页码范围内时显示）
        if ($currentPage > 1 && $start > 1) {
            $html .= '<a href="' . self::buildPageUrl($baseUrl, $paramName, 1) . '" class="page-num">1</a>';
        }
        // 上一页
        if ($currentPage > 1) {
            $html .= '<a href="' . self::buildPageUrl($baseUrl, $paramName, $currentPage - 1) . '" class="page-prev">上一页</a>';
        }
        // 省略号
        if ($start > 2) $html .= '<span class="page-ellipsis">...</span>';
        // 数字页码
        for ($i = $start; $i <= $end; $i++) {
            if ($i == $currentPage) {
                $html .= '<span class="page-current">' . $i . '</span>';
            } else {
                $html .= '<a href="' . self::buildPageUrl($baseUrl, $paramName, $i) . '" class="page-num">' . $i . '</a>';
            }
        }
        // 省略号
        if ($end < $totalPages - 1) $html .= '<span class="page-ellipsis">...</span>';
        // 下一页
        if ($currentPage < $totalPages) {
            $html .= '<a href="' . self::buildPageUrl($baseUrl, $paramName, $currentPage + 1) . '" class="page-next">下一页</a>';
        }
        // 末页（仅当末页不在数字页码范围内时显示）
        if ($currentPage < $totalPages && $end < $totalPages) {
            $html .= '<a href="' . self::buildPageUrl($baseUrl, $paramName, $totalPages) . '" class="page-num">' . $totalPages . '</a>';
        }
        $html .= '</div>';
        return $html;
    }

    private static function buildPageUrl($baseUrl, $paramName, $page) {
        $sep = strpos($baseUrl, '?') !== false ? '&' : '?';
        return $baseUrl . $sep . $paramName . '=' . $page;
    }

CSS代码：

/* --- Pagination --- */
.pagination {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 40px;
    flex-wrap: wrap;
}

.pagination a,.pagination span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 12px;
    border-radius: var(--radius-sm);
    font-size: 14px;
    transition: var(--transition);
}

.pagination a {
    background: var(--bg-card);
    color: var(--text-secondary);
    border: 1px solid var(--border-color);
}

.pagination a:hover {
    background: var(--color-primary);
    color: var(--color-white);
    border-color: var(--color-primary);
}

.pagination .current {
    background: var(--color-primary);
    color: var(--color-white);
    border: 1px solid var(--color-primary);
}

.pagination .disabled {
    color: var(--text-secondary);
    opacity: 0.5;
    cursor: not-allowed;
}