html5&css&js代码 018颜色表
HTML5, CSS 和 JavaScript 可以用来创建一个颜色表,下面是一个简单的示例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>颜色表</title>
<style>
.color-table {
border-collapse: collapse;
width: 100%;
}
.color-table th, .color-table td {
border: 1px solid #ddd;
padding: 8px;
text-align: left;
}
.color-table tr:nth-child(even) {
background-color: #f2f2f2;
}
</style>
</head>
<body>
<h2>颜色表</h2>
<table class="color-table">
<tr>
<th>颜色名称</th>
<th>十六进制</th>
<th>RGB</th>
</tr>
<tr>
<td>红色</td>
<td>#FF0000</td>
<td>rgb(255, 0, 0)</td>
</tr>
<tr>
<td>绿色</td>
<td>#00FF00</td>
<td>rgb(0, 255, 0)</td>
</tr>
<tr>
<td>蓝色</td>
<td>#0000FF</td>
<td>rgb(0, 0, 255)</td>
</tr>
<!-- 更多颜色行 -->
</table>
<script>
// JavaScript 代码可以用来动态生成颜色表,但这里我们手动添加了几行作为示例
</script>
</body>
</html>
这个示例创建了一个简单的颜色表,包括颜色名称、十六进制和RGB代码。你可以根据需要添加更多的颜色信息。使用CSS为表格添加了条纹背景,使用JavaScript可以动态生成颜色信息,或者从外部数据源获取颜色数据。
评论已关闭