【css】2.奇偶隔行变色nth-child(odd/even)

<template>
  <div class="content">
    <div v-for="item in 8" :key="item" class="title">{{ item }}-{{ item }}-{{ item }}</div>
  </div>
</template>
<script>
export default {
  name: "HelloWorld",
  props: {
    msg: String,
  },
  data() {
    return {};
  },
  methods: {},
  mounted() {},
};
</script>
<style scoped lang="scss">
.content .title:nth-child(odd) {
  color: #a31e1e;
  font-weight: 600;
}
content .title:nth-child(even) {
  color: #380b74;
  font-weight: 600;
}
</style>

.el-carousel__item:nth-child(2n) {
  background-color: #99a9bf;
}

.el-carousel__item:nth-child(2n + 1) {
  background-color: #d3dce6;
}