rowspan
肯定是要走的路。但是,您需要跟踪要跨越的行数,然后相应地构造 HTML,而不是随手吐出 HTML。
这是一个有趣的问题,没有简单的解决方案。问题是它rowspan
必须存在于 first中,但是在处理完它们之前,<td>
您不会知道要跨越多少行。最好的办法是查看 PHP 的Document Object Model。DOM 将允许您构建表并根据需要调整属性。rowspan
几个地方开始:
更新
这应该说明所涉及的内容。
<html>
<head>
<title>My Sample</title>
<style type="text/css">
body {
font: normal 62.5% sans-serif;
}
table {
font-size: 1.3em;
width: 420px;
border: 0;
border-collapse:collapse;
}
td {
vertical-align: top;
border-bottom: 1px solid #000;
}
</style>
</head>
<body>
<?php
$works = array(
array(
'composer' => 'HAYDN, Joseph',
'title' => 'Die Schöpfung',
'role' => 'Adam'
),
array(
'composer' => 'HAYDN, Joseph',
'title' => 'Die Schöpfung',
'role' => 'Raphäel'
),
array(
'composer' => 'HAYDN, Joseph',
'title' => 'Il mondo della luna',
'role' => 'Ernesto'
),
array(
'composer' => 'HAYDN, Joseph',
'title' => 'La vera costanza',
'role' => 'Masino'
),
array(
'composer' => 'MENOTTI, Gian Carlo',
'title' => 'The Telephone',
'role' => 'Ben'
),
array(
'composer' => 'MOORE, Douglas',
'title' => 'Gallantry',
'role' => 'Dr Gregg'
),
array(
'composer' => 'MOZART, Wolfgang Amadeus',
'title' => 'Die Zauberflöte',
'role' => 'Der Sprecher'
),
array(
'composer' => 'MOZART, Wolfgang Amadeus',
'title' => 'Die Zauberflöte',
'role' => 'Papageno'
),
array(
'composer' => 'MOZART, Wolfgang Amadeus',
'title' => 'La nozze di Figaro',
'role' => 'Il conte Almaviva'
),
array(
'composer' => 'NICHOLSON, Alisdair',
'title' => 'Two sisters, a rose, a flood and snow',
'role' => 'baritone'
),
array(
'composer' => 'OFFENBACH, Jacques',
'title' => 'Barbe-bleue',
'role' => 'Graf Oscar'
),
array(
'composer' => 'OFFENBACH, Jacques',
'title' => 'La vie parisienne',
'role' => 'Bobinet'
),
array(
'composer' => 'PUCCINI, Giacomo',
'title' => 'La bohème',
'role' => 'Schaunard'
),
array(
'composer' => 'PUCCINI, Giacomo',
'title' => 'Madama Butterfly',
'role' => 'Il principe'
),
array(
'composer' => 'PUCCINI, Giacomo',
'title' => 'Madama Butterfly',
'role' => 'Yamadori'
)
);
$current_composer = '';
$current_title = '';
$composer_row_count = 1;
$title_row_count = 1;
$doc = new DOMDocument();
$table = $doc->createElement('table');
$doc->appendChild($table);
foreach($works as $work)
{
$row = $doc->createElement('tr');
$table->appendChild($row);
if ($current_composer !== $work['composer']) {
$current_composer = $work['composer'];
$composer_row_count = 1;
$composer_col = $doc->createElement('td', $work['composer']);
$row->appendChild($composer_col);
} else {
$composer_col->setAttribute('rowspan', ++$composer_row_count);
}
if ($current_title !== $work['title']) {
$current_title = $work['title'];
$title_row_count = 1;
$title_col = $doc->createElement('td', $work['title']);
$row->appendChild($title_col);
} else {
$title_col->setAttribute('rowspan', ++$title_row_count);
}
$role_col = $doc->createElement('td', $work['role']);
$row->appendChild($role_col);
}
echo $doc->saveHTML();
?>
</body>
</html>
复制代码并运行它。布局正是您所要求的,但您自然需要根据需要对其进行调整。