css弦乐画什么控制器 |css 图片背景色

.harp {
display: flex; /* 将弦乐中的音符横向排列 */
align-items: flex-end; /* 音符对齐在弦的底部 */
justify-content: space-between; /* 弦间距相等 */
}
.harp .string {
width: 2px; /* 弦的粗细 */
height: 90px; /* 弦的长度 */
position: relative; /* 为控制器设置绝对定位，以免影响其他元素 */
}
.harp .string:nth-child(1) {
background-color: #331a00; /* 色值可以根据实际需求调整 */
left: 20px; /* 控制器位置 */
}
.harp .string:nth-child(2) {
background-color: #4d2600;
left: 45px;
}
.harp .string:nth-child(3) {
background-color: #664d00;
left: 70px;
}
.harp .string:nth-child(4) {
background-color: #806600;
left: 95px;
}
.harp .string:nth-child(5) {
background-color: #998000;
left: 120px;
}
.harp .string:nth-child(6) {
background-color: #b3ad00;
left: 145px;
}
.harp .string:nth-child(7) {
background-color: #cccc1a;
left: 170px;
}
.harp .string:nth-child(8) {
background-color: #e6e600;
left: 195px;
}
.harp .string:nth-child(9) {
background-color: #ffff00;
left: 220px;
}

上面这段代码就是控制弦乐的控制器代码。大家先定义了一个公共的class为.harp，然后在它的子元素string中设置不同颜色（按照音阶调整），并且使用nth-child选择器来指定控制器的位置。由此，大家就可以通过修改这些属性值来实现不同形状的弦乐乐器了。