微信小程序-伪类选择器

news2025/2/27 5:04:09

一.伪类选择器

结构伪类常见书写方式:

第一类:找第几个孩子

    1.    :first-child 找第一个孩子
    2.    :last-child 找最后一个孩子
    3.    :nth-child(),正着找
           数字:写数字几就是找第几个孩子,
           2n或者even:找偶数
           2n+1或者odd:找奇数
    4.    :nth-last-child(),倒着找
           数字:写数字几就是找倒数第几个孩子。

第二类: 从限定的类型中找第几个

    1.    :fist-of-type,从同类型中找出第一个孩子
    2.    :last-of-type,从同类型中找出最后一个孩子
    3.    :nth-of-type(数字),从同类型中找出第几个个孩子

微信小程序中使用

在wxml中写一个列表渲染

<view wx:for="{{numList}}" wx:key="*this">{{item}}</view>

使用伪类选择器

view{
  height: 400rpx;
  display: flex;
  align-items: center;
  justify-content: center;
}
view:nth-child(odd){ //奇数
  background-color: lightblue;
}
view:nth-child(even){ //偶数
  background-color: lightcoral;
}

实现效果:
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1841632.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

做一个架构师需要什么能力?

作为一个架构师&#xff0c;需要具备多方面的能力来确保项目的顺利进行和系统的成功设计。以下是架构师所需的主要能力&#xff0c;按照不同的类别进行归纳和分点表示&#xff1a; 技术能力 编程能力&#xff1a;架构师通常是一个开发团队中技术较为出色的人员之一&#xff0…

【网络安全学习】使用Kali做信息收集-01-<域名信息主机信息>

1.收集开源情报 开源情报(Open Source Intelligence&#xff0c;OSINT)是指从各种公开的渠道中寻找和获取有价值的信息 如&#xff1a;互联网、媒体、社交网络、公共数据库等开源情报具有以下特点&#xff1a; - 丰富性&#xff1a;开源情报涵盖了各种类型和领域的信息 - 可…

【微服务】什么是Hystrix?一文带你入门Hystrix

文章目录 强烈推荐引言主要功能实现容错应用场景1. 远程服务调用2. 防止级联故障3. 网络延迟和超时管理4. 资源隔离5. 高并发场景6. 熔断与自动恢复7. 故障检测与监控 示例应用场景使用实例1. 引入依赖2. 创建 Hystrix 命令类3. 使用 Hystrix 命令4. 配置 Hystrix5. 实时监控集…

Python语言修改控制台输出文字的颜色和背景颜色

Python语言修改控制台输出文字的颜色和背景颜色 格式显示模式字体颜色背景颜色文字加效果显示类 格式 \033[显示模式;字体颜色;背景颜色m 显示模式 显示模式格式将文本颜色和背景颜色重置为默认值&#xff0c;取消所有其他文本属性\033[0m高亮&#xff08;加粗&#xff09;\03…

一站式实时数仓Hologres整体能力介绍

讲师&#xff1a;阿里云Hologres PD丁烨 一、产品定位 随着技术的进步&#xff0c;大数据正从规模化转向实时化处理。用户对传统的T1分析已不满足&#xff0c;期望获得更高时效性的计算和分析能力。例如实时大屏&#xff0c;城市大脑的交通监控、风控和实时的个性化推荐&…

AMEYA360 | 江苏润石最新发布12颗车规级模拟芯片

日前江苏润石再度新增12颗通过AEC-Q100 Grade1&#xff0c;满足MSL 1湿敏等级认证的车规级芯片。截止目前&#xff0c;润石科技总计有70颗Grade1 & MSL1的车规级芯片通过认证并进入量产。凭借卓越的产品技术指标和稳定的品质性能不仅展示了公司在车规级模拟芯片领域的技术积…

React 通信:深层传递(Props、Context、Children Jsx)

在之前的文章 探讨&#xff1a;围绕 props 阐述 React 通信 中总结了关于“父子”组件传值&#xff0c;但是当需要在组件树中深层传递参数以及需要在组件间复用相同的参数时&#xff0c;传递 props 就会变得很麻烦。 实际案例&#xff1a; 下述展示有两种状态&#xff1a;① 详…

智慧分流:探索互联网与物联网的负载均衡技术

数字化时代&#xff0c;个人认为&#xff0c;无论是互联网还是物联网&#xff0c;还是其他网&#xff0c;在各个层级&#xff0c;都对系统的稳定性和效率提出了更高的要求。负载均衡技术作为保障系统平稳运行的关键&#xff0c;其重要性不言而喻。在数字世界的海洋中&#xff0…

【TB作品】MSP430G2553,单片机,口袋板, 单相交流电压、电流计设计

题5 单相交流电压、电流计设计 设计基于MSP430的单相工频交流电参数检测仪。交流有效值0-220V&#xff0c;电流有效值0-40A。电压、电流值经电压、电流传感器输出有效值为0-5V的交流信号&#xff0c;传感器输出的电压、电流信号与被测电压、电流同相位。 基本要求如下 &#xf…

AI写作平台:提升文档撰写效率的神器

工欲善其事&#xff0c;必先利其器。 随着AI技术与各个行业或细分场景的深度融合&#xff0c;日常工作可使用的AI工具呈现出井喷式发展的趋势&#xff0c;AI工具的类别也从最初的AI文本生成、AI绘画工具&#xff0c;逐渐扩展到AI思维导图工具、AI流程图工具、AI生成PPT工具、AI…

电子竞赛6——基于DDS的正弦波发生器

前言 作为电子系统必不可少的信号源,在很大程度上决定了系统的性能, 因而常称之为电子系统的“心脏”。传统的信号源采用振荡器, 只能产生少数几种波形,自动化程度较低,且仪器体积大,灵活性与准确度差。而现在要求信号源能产生波形的种类多、频率高,而且还要体积小、可靠性高、…

推荐一款功能强大的显示器!

最近在写项目开发文档&#xff0c;经常需要几个界面来回切换&#xff0c;真的深刻感受到了一台外接显示器对一名程序员来说有多重要了&#xff0c;画功能流程图的时候嫌弃自己的笔记本屏幕不够大&#xff0c;看代码的时候又在想要是有个旋转屏就好了&#xff0c;来回切换界面的…

【OpenHarmony开发】自定义系统应用之实践

前言 OpenHarmony系统应用是指预装在OpenHarmony操作系统中的应用程序&#xff0c;也称为系统应用。这些应用程序通常由操作系统开发者开发&#xff0c;包括系统设置、电话、短信、浏览器、相机、音乐、视频等常用应用程序。这些应用程序通常具有更高的权限和更深入的系统集成…

看到漂亮的UI设计,就挪不开眼,还有救吗?

在App设计中&#xff0c;瓷片区&#xff08;Tile Area&#xff09;是指用于展示信息或功能的独立区域。瓷片区可以被设计成具有不同的形状、大小、颜色和内容。以下是瓷片区的一些作用&#xff1a; 信息展示&#xff1a; 瓷片区可以用于显示重要的信息&#xff0c;如最新消息、…

uni-app 表格tr添加点击事件

首先找到uni.tr这个组件的页面&#xff0c;路径uni_modules/uni-table/components/uni-tr/uni-tr.vue 然后添加点击事件 在你的表格页面就可以添加点击事件了

电脑C盘满了怎么清理?5招为您释放电脑空间!

“我的电脑使用了一段时间了&#xff0c;不知道是不是因为内存满了&#xff0c;现在很多功能都没办法使用。有什么方法可以清理c盘空间且不误删重要文件的吗&#xff1f;” 当我们打开电脑&#xff0c;发现系统提示C盘空间不足&#xff0c;或者电脑运行变得缓慢时&#xff0c;很…

LabVIEW电磁超声热态金属在线缺陷检测系统

LabVIEW软件开发的电磁超声热态金属在线缺陷检测系统针对极端高温环境下的金属材料&#xff0c;进行实时、无损的缺陷检测&#xff0c;具有高精度和高可靠性&#xff0c;能够显著提高材料质量控制的效率和准确性。 项目背景 随着工业技术的发展&#xff0c;高温环境下的金属材…

高德地图轨迹回放/轨迹播放

前言 本篇文章主要介绍高德地图的轨迹回放或播放的实现过程&#xff0c;是基于vue2实现的功能&#xff0c;同时做一些改动也是能够适配vue3的。其中播放条是用的是element UI中的el-slider组件&#xff0c;包括使用到的图标也是element UI自带的。可以实现轨迹的播放、暂停、停…

这三种电容在PCB设计中怎么摆放?

电容在高速 PCB 设计中起着重要的作用&#xff0c;通常也是 PCB 上用得多的器件。在 PCB 中&#xff0c;电容通 常分为滤波电容、去耦电容、储能电容等。 1 电源输出电容&#xff0c;滤波电容 我们通常把电源模块输入、输出回路的电容称为滤波电容。简单理解就是&#xff0c;…

56岁张卫健前任貌突然回春大进化?自曝婚礼前夕流产

现年56岁的江欣燕于1985年以18岁之龄参加第4届新秀歌唱大赛入行&#xff0c;曾拍过多部无线经典电视剧&#xff0c;包括《娱乐插班生》、《同事三分亲》及《女人俱乐部》等。现时甚少作幕前演出的江欣燕日前在社交平台上载分享了新短片&#xff0c;当中更以Deep V上阵&#xff…