用php写一个兼容移动端的竖向表格，要有表头和漂亮样式，用于展示循环数据，数据来自ajax

以下是一个简单的PHP代码示例，用于生成一个兼容移动端的竖向表格，并从AJAX获取数据进行循环展示：

HTML/CSS部分：

<style>
    table {
        border-collapse: collapse;
        width: 100%;
    }
    th, td {
        text-align: left;
        padding: 8px;
        border-bottom: 1px solid #ddd;
    }
    th {
        background-color: #f2f2f2;
    }
    @media (max-width: 600px) {
        table {
            display: block;
            overflow-x: auto;
            white-space: nowrap;
        }
        th, td {
            display: inline-block;
            width: 100px;
        }
    }
</style>

<table>
    <thead>
        <tr>
            <th>列1</th>
            <th>列2</th>
            <th>列3</th>
            <th>列4</th>
        </tr>
    </thead>
    <tbody id="table-body">
    </tbody>
</table>

JavaScript部分：

<script>
    $(document).ready(function() {
        // AJAX请求数据
        $.ajax({
            url: "data.php",
            dataType: "json",
            success: function(data) {
                // 遍历数据并生成表格行
                for (var i = 0; i < data.length; i++) {
                    var row = $("<tr>");
                    row.append($("<td>").text(data[i].col1));
                    row.append($("<td>").text(data[i].col2));
                    row.append($("<td>").text(data[i].col3));
                    row.append($("<td>").text(data[i].col4));
                    $("#table-body").append(row);
                }
            }
        });
    });
</script>

PHP部分：

<?php
    // 假设数据存储在数组中
    $data = array(
        array("col1"=>"数据1-1", "col2"=>"数据1-2", "col3"=>"数据1-3", "col4"=>"数据1-4"),
        array("col1"=>"数据2-1", "col2"=>"数据2-2", "col3"=>"数据2-3", "col4"=>"数据2-4"),
        array("col1"=>"数据3-1", "col2"=>"数据3-2", "col3"=>"数据3-3", "col4"=>"数据3-4"),
        // ...
    );

    // 将数据转换为JSON格式并输出
    header('Content-Type: application/json');
    echo json_encode($data);
?>

以上代码将生成一个具有可响应式设计的竖向表格，并从AJAX获取数据进行循环展示。您可以根据自己的需求更改样式和PHP代码来适应不同的数据和设计要求。