ホームページ > 記事 > ウェブフロントエンド > CSSでテーブルの色を設定する方法
CSSでテーブルの色を設定する方法
- 藏色散人オリジナル
- 2021-04-09 10:05:563788ブラウズ
CSS でテーブルの色を設定する方法: まず、設定する必要があるテーブル コード コンテンツを見つけて開きます。次に color 属性を使用してテーブル内のテキストの色を設定し、最後にテーブルの背景色を設定します。背景属性を介してテーブル。
この記事の動作環境: Windows7 システム、HTML5&&CSS3 バージョン、Dell G3 コンピューター。
CSS での表の色の設定
表の色の設定は非常にシンプルで、テキストの色の設定とまったく同じです。
CSS は color 属性を通じてテーブル内のテキストの色を設定し、background 属性を通じてテーブルの背景色を設定します。
<span style="font-size:24px;"><html>
<head>
<title>
年度收入
</title>
<style>
<!--
body{
background-color:#ebf5ff;
margin:0px;
padding:4px;
text-align:center;
}
.datalist{
color:#0046a6;
background-color:#d2e8ff;
font-family:Arial;
}
.datalistcaption{
font-size:18px;
font-weight:bold;
}
.datalistth{
color:#003e7e;
background-color:#7bb3ff;
}
-->
</style>
</head>
<body>
<tablesummary="This table shows the yearly income for years 2004 through2007" border="1">
<caption>年度收入2004-2007</caption>
<tr>
<th></th>
<thscope="col">2004</th>
<thscope="col">2005</th>
<thscope="col">2006</th>
<thscope="col">2007</th>
</tr>
<tr>
<thscope="row">捐款</th>
<td>11.980</td>
<td>12.650</td>
<td>9.700</td>
<td>10.600</td>
</tr>
<tr>
<thscope="row">拨款</th>
<td>11.980</td>
<td>12.650</td>
<td>9.700</td>
<td>10.600</td>
</tr>
<tr>
<thscope="row">投资</th>
<td>11.980</td>
<td>12.650</td>
<td>9.700</td>
<td>10.600</td>
</tr>
<tr>
<thscope="row">募捐</th>
<td>11.980</td>
<td>12.650</td>
<td>9.700</td>
<td>10.600</td>
</tr>
<tr>
<thscope="row">销售</th>
<td>11.980</td>
<td>12.650</td>
<td>9.700</td>
<td>10.600</td>
</tr>
</table>
</body>
</html></span>この時点で、ページの背景色、テーブルの背景色、行と列の名前の色、フォントがすべて変更されていることがわかります。これらの設定は次のとおりです。本文のCSS設定と全く同じ、ページ背景のCSS設定も全く同じです。
【推奨学習: css ビデオ チュートリアル 】
以上がCSSでテーブルの色を設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。