利用LESS简单实现网页一键换肤功能，爱星物联网页换肤原来如此简单

时间： 2024-06-23 来源：安信可科技

代理服务

技术支持

采购服务

上次说到LESS。

他是CSS，只是多了一点东西。

这个东西是什么呢？本次换肤就用上了。

以上就是LESS比CSS多出来的扩展。

这次我们用变量来实现快速换肤。

打开代码目录src - styles - global.less 文件，可以看到里面已经定义了一些变量。当然，根据自己需要也可以自己定义样式变量。

在main.js文件引入了这个全局变量

接下来，我们把页面的颜色换成变量值。

将颜色的属性值换成变量后，该属性即展现了变量配置的颜色。

如果我直接将主题色换成了绿色，效果会怎么样呢？

噔噔蹬蹬……

没想到吧？除了底部按钮，其他组件的颜色怎么也变成绿色了呢？

因为这个组件库的变量也调用了全局变量的。所以只要改了@theme-color变量的值，所有调用这个变量的值都会随之改变。

图十一

搞定！

总结

以上就是本期分享的内容，目的在于让大家快速适应新品方案的开发，更多资料可从我们官网上获取。

发送到邮箱 |
+1 赞 0
收藏
评论 0
| 转发至：

本文由中国颜值的半壁江山转载自安信可科技，原文标题为:爱星物联——网页换肤原来如此简单，本站所有转载文章系出于传递更多信息之目的，且明确注明来源，不希望被转载的媒体或个人可与我们联系，我们将立即进行删除处理。

平台合作

提交评论

全部评论（0）

暂无评论

【经验】如何将安信可科技的PB-03F模块升级DTM固件进行认证测试？

使用安信可科技的蓝牙模组PB-03F进行产品设计后期，部分产品需要连同PB-03F模块一同送去认证机构进行认证测试，此时需要给蓝牙模组PB-03F烧录特殊的测试固件DTM。本文指导如何给PB-03F模块烧写DTM固件。

2023-06-22 - 设计经验代理服务技术支持采购服务

安信可星闪模组专属ComboAT初体验：点对点连接实现透传，强抗干扰、超低延迟、超远通讯

Ai-BS21-32S是由深圳市安信可科技有限公司开发的蓝牙星闪模块。本文中安信可科技将为大家介绍星闪模组Ai-BS21-32S的使用方法。

2024-04-10 - 设计经验代理服务技术支持采购服务

【经验】安信可科技LoRa模块Ra-08的固件烧录教程及指令说明示例

Ra-08透传固件主要功能有，设置发送或者接收模式，配置各个射频参数，设置本地地址与发送的目标地址，设置进入睡眠模式等。

2023-05-02 - 设计经验代理服务技术支持采购服务

安信可科技（Ai-Thinker）物联网专用模组&天线选型指南

LoRa product Radar product WiFi+Bluetooth products 2.4G Series Module GPS Series Module UWB & 4G series module GPRS series module Offline Voice Module Series Antenna

安信可科技 - 2.4G ANTENNA,NB-IOT ANTENNA,GPRS MODULE,CHIPS,5.8G 天线,4G ANTENNA,天线连接线,WI-FI MODULE,433MHZ ANTENNA,离线语音模块,开发板,4G天线,LOW-COST PURE OFFLINE SPEECH RECOGNITION MODULE,433MHZ天线,MODULES,DEVELOPMENT BOARDS,CONNECTION WIRE,NB-IOT天线,连接线,DEVELOPMENT BOARD,ANTENNA CONNECTING WIRE,868MHZ天线,ULTRA-COMPACT PACKAGE LTE CAT.1BIS MODULE,2.4G天线,868MHZ ANTENNA,OFFLINE SPEECH MODULE,OFFLINE VOICE MODULE,2.4G WI-FI模块,GPS 天线,2.4G WI-FI MODULE,ULTRA-WIDEBAND (UWB) TRANSCEIVER MODULE,GSM MODULE,INDOOR LORAWAN GATEWAY,WIFI+蓝牙模块,GATEWAY,HIGHLY INTEGRATED WI-FI SOC MODULES,RADAR,模块,ANTENNA,MULTI-MODE SATELLITE NAVIGATION RECEIVER SOC MODULE,GPRS天线,室内LORAWAN网关,COST-EFFECTIVE BLUETOOTH MODULE,芯片,WIFI+蓝牙网关,蓝牙模块,WIFI+BLUETOOTH FAMILY INTELLIGENT GATEWAY,WIFI+ BLUETOOTH MODULE,BLUETOOTH MODULE,高性价比的蓝牙模块,WIFI+BLUETOOTH GATEWAY,GPRS ANTENNA,超宽带收发模块,DUAL-BAND MODULE,高度集成的WI-FI SOC模块,RA-01SH,PB-02-KIT,RTL8720 SERIES,AI-WB1,AI-WB2,AI-WB2-M1,HI-07S-KIT,TB-02-KIT,AI-WB2-12F-KIT,AI-WB2-13-KIT,AI-WB2-13U,AI-WB2-01S,A9,SX1268,RA-01SC,TG-02-KIT,PB SERIES,RTL8710BX SERIES,GPS SERIES,AI-WB2-01M,VC-01-KIT,HI-12F,TB SERIES,HI-12F-KIT,BW16,AI-WB2 SERIES,BW15,BW14,TG-12F-KIT,BW12,RTL8710BX,A9G,HI SERIES,AI-WB2-12S,PB-03,SX126X,AI-WB1-32S,HI-07S,HI-07SL-KIT,PB-01,PB-02,RG-02,AI-WB1-32S-KIT,RTL8720DN,AI-WB2-12F,TG-01M,AI-WB1SERIES,NF-05,NF-02-PA,NF-04,NF-03,BW16-KIT,NF-01-S,SX127X,TB-03F-KIT,LLCC68,TG-02,AI-WB2-07S,NF-01-N,NF-02-PE,AI-WB1-32S-CAM,GP-02-KIT,AI-WB2-M1-I,TG-02M-KIT,TG-02M,RA-08-KIT,GP-01,GP-02,CA-01-KITC,CA-01,2.4G SERIES,AI-WB2-13,PB-03F,PB-03M,TG SERIES,TB-04-KIT,TB-05,GPRS SERIES,TB-04,TG-02F,TB-02,RTL8720DN SERIES,TG-02F-KIT,4G SERIES,PB-03M-KIT,AI-WB2-32S-KIT,BU01,RA-01,PB-03-KIT,ESP32-G,RTL8720,RA-08H,NF-04-MI,VC-02-KIT,NF-05-S,RA-01S,HI-12FL,RA-01H,HI-07SL,AI-WB2-32S,RA-01SCH,PB-01-KIT,RTL8720CF,TG-01M-KIT,TG-12F,AI-WB1-A1S,AI-WB1-12F,TB-03F,BW15-KIT,GPRS,UWB SERIES,GP-01-KIT,AI-WB1-12F-KIT,NODEMCU-BU01,RA-08H-KIT,RD-01,RA-02,RTL8720CF SERIES,RA-08,VC-02,VC-01,HI-12FL-KIT,PB-03F-KIT,智能化改造,HOME AUTOMATION,TABLETS,WEARABLE ELECTRONICS,远程灌溉系统,PARKING LOT,家电产品,SECURITY,智能照明,REMOTE METER READING,智能锁,智能穿戴,86 BOXES,MOBILE DEVICES,WIRELESS MOUSE,安防系统,REMOTE IRRIGATION SYSTEMS,UNMANNED AERIAL VEHICLE,插座,物联网,穿戴式电子,SMART FACTORY,WIRELESS POSITIONING SYSTEM SIGNALS,隧道交通,智慧家电,海马特插座,SECURITY SYSTEM,智慧工厂,无线定位系统信号,LAMPS,无人机,畜牧业,WEARABLE ELECTRONIC DEVICES,RETAIL PAYMENT,SECURITY MONITORING,SMART CITY,SMART LIGHTS,SMART WEAR,SUPPLY CHAIN,POS,无线鼠标,自动仪表读数,智能衣架,无线遥控,智能仪表,AUTOMATIC METER READING,物联网应用,IOT APPLICATIONS,SMART HOME,ANIMAL HUSBANDRY,INDUSTRIAL WIRELESS CONTROL,WEARABLE DEVICES,HMART SOCKET,SMART SOCKET,SMART INSTRUMENTATION,STREET LAMP MONITORING,安全系统,AUTOMOBILES,平板,远程抄表,智能灯光控制,零售支付,FIRE PROTECTION,INTERNET OF THINGS,移动设备,SMART LIGHTING,可穿戴电子设备,智慧开关,灯,路灯监控,智能家居类,天猫精灵应用,INDUSTRIAL PDA,遥控玩具,SHARING DEVICES,开关,CPE,智能交通,HOME BUILDING AUTOMATION,DATA CARDS,INTELLIGENT WEAR,工业PDA,铁方盒,汽车,智能安全,SMART WEARABLES,HOUSEHOLD APPLIANCES,SMART CLOTHES RACKS,家庭楼宇自动化,无线位置感知设备,PAVILION POSITIONING,WAREHOUSING LOGISTICS,SMART SECURITY,SMART SWITCH,家庭自动化,智能灯,WALKIE-TALKIES,智能插座,INTELLIGENT TRANSPORTATION,安防监控,INTELLIGENT TRANSFORMATION,工业无线控制,开关插座,运动感应设备,数据卡,IOT FIELDS,VEHICLE NAVIGATION,SMART LIGHT CONTROL,SWITCH SOCKETS,IOT RELATED SMART TERMINAL PRODUCTS,物联网领域,SMART TRANSPORTATION,消防类,井盖监测,智能可穿戴设备,展馆定位,安防,REMOTE IRRIGATION SYSTEM,SMART LOCKS,SECURITY SYSTEMS,WIRELESS LOCATION-AWARE DEVICES,TUNNEL TRAFFIC,SWITCHES,LOGISTICS,SMART SMALL HOUSEHOLD APPLIANCES,SMART HOME APPLIANCES,SMART CLOTHES RACK,IOT,INTELLIGENT LAMP,MOTION SENSING EQUIPMENT,TMALL GENIE APPLICATION,车辆导航,共享设备,SMART SWITCHES,玩具,TOYS,WIRELESS REMOTE CONTROL,INDUSTRIAL PDAS,穿戴式设备,物联网相关智能终端产品,对讲机,智慧城市,INTELLIGENT SOCKET,智慧交通,供应链,智能开关,MANHOLE COVER MONITORING,SOCKETS,物流,SMART SOCKETS,智能小家电,HOUSEHOLD APPLIANCES,仓储物流,车库,REMOTE CONTROL TOYS

2023/09/19 - 选型指南代理服务技术支持采购服务

安信可科技(Ai-Thinker)是国内领先的物联网无线通信模组供应商，公司集研发、生产、销售于一体，专注于物联网通信应用，致力于为全球物联网终端提供WiFi、蓝牙、LoRa、雷达、离线语音、UWB、NB-IoT、GPS/GPRS等稳定可靠的物联网软硬件无线连接方案。

代理服务线上商城技术资料

【IC】安信可科技发布2款UWB模组BU03和BU04，实现室内厘米级高精度测距定位

BU03和BU04这两款定位模组使用的芯片都是一样的，不同的是BU03是没有带主控MCU的，并且体积小巧，可以集成到自己的主板上，用主芯片直接驱动。

2024-10-11 - 产品代理服务技术支持采购服务

安信可科技无线模组选型表

提供安信可科技无线模组选型,封装:DIP/SMD,尺寸:10.3mm*9.9mm*2.4(±0.2)mm-120.0mm*120.0mm*30.0mm,通信接口:UART/GPIO/ADC/PWM/I?C/SPI/Touch senser/PSRAM/SDIO/Duplex I²S/麦克风/扬声器,最大速率:2.5mW-100mW,参考距离:80m-5km,供电电压:1.9V-5.25V

产品型号	品类	封装	尺寸(mm)	通信接口	最大速率(mW)	参考距离(m/km)	供电电压(V)	空中速率(Kbps/Mbps)	天线形式	工作温度(℃)
NF-01-S	2.4G模组	DIP-8	28.6mm*15.3mm	SPI	5mW	240m	1.9V-3.6V	250Kbps-2Mbps	板载天线	-20℃～70℃