› 是。 › 日志

是。

http://www.javakc.com

编写css代码，使表格实现如下效果

2022-01-13 15:30:22 查看(136) 回复(0)

页面中有如下表格：

1	2	3	4
5	6	7	8
9	10	11	12

代码如下：

<table width="300" height="200" border="1">
			<tr>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
			</tr>
			<tr>
				<td>5</td>
				<td>6</td>
				<td>7</td>
				<td>8</td>
			</tr>
			<tr>
				<td>9</td>
				<td>10</td>
				<td>11</td>
				<td>12</td>
			</tr>
		</table>

编写css代码，使表格实现如下效果：

第1,5,9,4,8,12单元格文字居中

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表格实现小题</title>
    <style>
        .td1{ text-align: center;
        }
    </style>
</head>
<body>
<div>
    <table width="300" height="200" border="1">
                <tr>
                    <td class="td1">1</td>
                    <td>2</td>
                    <td>3</td>
                    <td class="td1">4</td>
                </tr>
                <tr>
                    <td class="td1">5</td>
                    <td>6</td>
                    <td>7</td>
                    <td class="td1">8</td>
                </tr>
                <tr>
                    <td class="td1">9</td>
                    <td>10</td>
                    <td>11</td>
                    <td class="td1">12</td>
                </tr>
    </table>
</div>
</body>
</html>