【css】7.nth-of-type(1)

最新推荐文章于 2025-06-25 15:41:32 发布

前端小云儿

最新推荐文章于 2025-06-25 15:41:32 发布

阅读量453

点赞数

CC 4.0 BY-SA版权

分类专栏： css 文章标签： css

本文链接：https://blog.csdn.net/jieweiwujie/article/details/121719277

css 专栏收录该内容

75 篇文章

订阅专栏

本文将深入讲解如何使用HTML、CSS和JavaScript实现网页布局和动态效果，从基础语法到高级技巧，带你提升前端设计能力。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

.content p { &:nth-of-type(1) { color: red; }

<template>
  <div class="content">
    <p>111111</p>
    <p>22222</p>
    <p>33333</p>
    <p>444444</p>
    <p>555555</p>
    <p>666666</p>
  </div>
</template>
<script>
export default {
  name: "HelloWorld",
  props: {
    msg: String,
  },
  data() {
    return {};
  },
  methods: {},
  mounted() {},
};
</script>
<style scoped lang="scss">
.content p {
  &:nth-of-type(1) {
    color: red;
  }
  &:nth-of-type(2) {
    color: brown;
  }
  &:nth-of-type(3) {
    color: blueviolet;
  }
  &:nth-of-type(4) {
    color: burlywood;
  }
}
</style>