CSS样式表
<style>
ul {list-style: none;}
li {padding: 10px;}
li:nth-child(odd) {
background: #16a085;
color:white ;
}
<style>
<script>
let lessons
=[
{ title : ”媒体查询响应式布局" },
{ title : "FLEX弹性盒模型” },
{ title : "GRID栅格系统" }
];
function template() {
return `
<ul>${ lessons .map( item =>` <li>${item. title}</ li>`). join("")}</ul>`;
}
document . body . innerHTML = template( );
</script>
|