记录css好看的颜色
要记录CSS中好看的颜色,可以创建一个CSS文件,在其中定义颜色变量,并在HTML文件中引用这些变量。以下是一个简单的例子:
CSS文件 (colors.css
):
:root {
--primary-color: #3498db; /* Brighton */
--secondary-color: #e74c3c; /* Alizarin */
--tertiary-color: #1abc9c; /* Troy */
--accent-color: #9b59b6; /* Amethyst */
--background-color: #ecf0f1; /* Silver */
--text-color: #2c3e50; /* Asbestos */
}
body {
background-color: var(--background-color);
color: var(--text-color);
}
.button-primary {
background-color: var(--primary-color);
color: var(--text-color);
}
.button-secondary {
background-color: var(--secondary-color);
color: var(--text-color);
}
HTML文件:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Color Palette</title>
<link rel="stylesheet" href="colors.css">
</head>
<body>
<button class="button-primary">Primary Action</button>
<button class="button-secondary">Secondary Action</button>
</body>
</html>
这个例子定义了一组颜色变量,并在CSS中使用它们来设置背景和文本颜色。然后在HTML文件中引用这个CSS文件,最后通过两个按钮来展示不同的颜色应用。这样,你可以在不同的项目中重复使用这些颜色,而不需要记住具体的十六进制颜色值。
评论已关闭