如何解决从 JSON 文件中更改 2 个 ARTICLE 元素的背景颜色
我有一个这样设置的 JSON 文件:
myColors = [
{
"colors": [
{
"color": "black","category": "hue","type": "primary","code": {
"rgba": [
0,1
],"hex": "#000"
}
},{
"color": "white","category": "value","type": "tint","code": {
"rgba": [
255,255,"hex": "#FFF"
}
},{
"color": "red","hex": "#F00"
}
},{
"color": "blue","hex": "#00F"
}
},{
"color": "yellow","hex": "#FF0"
}
},{
"color": "green","type": "secondary","hex": "#0F0"
}
}
]
}
]
和一个像这样设置的 HTML 文件:
<!doctype html>
<html>
<head>
<title></title>
<link href="ces.css" rel="stylesheet">
</head>
<body>
<main>
<header>
<h1>Site</h1>
</header>
<section>
<article>
<h2>Title</h2>
<p>Lorem ipsum dolor sit amet,consectetur adipisicing elit. Nemo molestias ex officia eligendi reiciendis fuga magnam? Ullam ut ab doloremque accusamus iusto aliquam facilis sapiente!</p>
</article>
<article>
<h2>Title</h2>
<p>Lorem ipsum dolor sit amet,consectetur adipisicing elit. Nemo molestias ex officia eligendi reiciendis fuga magnam? Ullam ut ab doloremque accusamus iusto aliquam facilis sapiente!</p>
</article>
</section>
<aside>
<div class="module">
<h3>Module</h3>
<p>Lorem ipsum dolor sit amet,consectetur adipisicing elit. Optio rem ab delectus fugit repellendus perspiciatis dolor consequuntur tenetur voluptatem a vitae odit aspernatur? Voluptas quisquam corporis nostrum aspernatur aliquid harum saepe ab pariatur veniam iste ipsam alias nemo voluptatibus doloribus.</p>
</div>
</aside>
</main>
</body>
</html>
我需要做的是用适当的内容和颜色指示符替换所有 ARTICLE 区域。
我当前的 CSS 如下所示:
body {
padding: 30px;
}
header {
background: lightblue;
}
section {
background: lightgreen;
width: 75%;
float: left;
}
article {
background: white;
margin: 0 0 1rem 0;
}
aside {
background: pink;
width: 25%;
float: right;
}
header,article,section,.module {
padding: 1rem;
}
我尝试过使用 javaScript 和 jQuery,但无法实现。我可以创建新的 div 并执行此操作或使用文本值附加 div,但无法更改颜色。我花了 2 天的时间试图实现这一目标,但对接下来要做什么完全不知所措。任何帮助将不胜感激。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。