css表格怎么添加背景颜色?

css表格怎么添加背景颜色?下面本篇文章给大家介绍一下CSS设置表格颜色的方法。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。

表格的颜色设置非常简单,和文字的颜色设置完全一样。

CSS通过background/background-color属性设置表格的背景颜色;通过color属性设置表格中文字的颜色。

示例:

<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>年度收入</title>
		<style>
			body {
				background-color: #ebf5ff;
				margin: 0px;
				padding: 4px;
				text-align: center;
			}
			table{
				background-color:pink;
				color: white;
			}
		</style>
	</head>

	<body>
		<h3>年度收入</h3>
		<table border="1">
			<tr>
				<th></th>
				<th scope="col">2004</th>
				<th scope="col">2005</th>
				<th scope="col">2006</th>
				<th scope="col">2007</th>
			</tr>
			<tr>
				<th scope="row">捐款</th>
				<td>11.980</td>
				<td>12.650</td>
				<td>9.700</td>
				<td>10.600</td>
			</tr>
			<tr>
				<th scope="row">拨款</th>
					<td>11.980</td>
					<td>12.650</td>
					<td>9.700</td>
					<td>10.600</td>
			</tr>
			<tr>
				<th scope="row">投资</th>
				<td>11.980</td>
				<td>12.650</td>
				<td>9.700</td>
				<td>10.600</td>
			</tr>
			<tr>
				<th scope="row">募捐</th>
					<td>11.980</td>
					<td>12.650</td>
					<td>9.700</td>
					<td>10.600</td>
			</tr>
			<tr>
				<th scope="row">销售</th>
				<td>11.980</td>
				<td>12.650</td>
				<td>9.700</td>
				<td>10.600</td>
			</tr>
		</table>
	</body>

</html>

效果图:

1.png

更多web前端自学知识,请查阅 HTML中文网 !!

以上就是css表格怎么添加背景颜色?的详细内容,更多请关注web前端其它相关文章!

赞(0) 打赏
未经允许不得转载:web前端首页 » CSS3 答疑

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏