用js生成三十种背景颜色不同的css样式表

在JavaScript中，我们可以生成一个包含30种不同背景颜色的CSS样式表。这里是一个简单的示例，我们将使用随机数生成RGB值，并将其转换为Hex颜色。以下是生成并打印样式的函数：

function generateRandomColor() {
    return '#' + ((1 << 24) * Math.random() | 0).toString(16);
}

function createStyleSheet(colorsCount) {
    let css = '';
    for (let i = 0; i < colorsCount; i++) {
        const color = generateRandomColor();
        css += `div.color-sample-${i} {
                background-color: ${color};
                width: 50px;
                height: 50px;
                display: inline-block;
                margin: 5px;
            }`;
        if (i % 9 === 8) { // 每隔9行换一行，以保持样式表清晰
            css += '\n';
        }
    }
    return css;
}

const styles = createStyleSheet(30);
console.log(styles); // 输出到浏览器控制台或保存到一个文件

// 如果需要将样式应用到HTML上，可以创建一个新元素插入到文档中
const styleElement = document.createElement('style');
document.head.appendChild(styleElement);
styleElement.innerHTML = styles;

这个脚本会生成30个带随机背景颜色的`div`，每个`div`都有唯一的ID以便识别。你可以根据实际需求调整样式细节。