微信小程序-WXSS的书写格式

简介: 编写在当前页面文件夹当中的 WXML 的 WXSS 文件当中:

行内样式

<view style="color: red;">行内样式</view>


页面样式


编写在当前页面文件夹当中的 WXML 的 WXSS 文件当中:


index.wxss:

.pageStyle {
  color: pink;
}


index.wxml:

<view class="pageStyle">页面样式</view>


全局样式


编写在 app.wxss 文件当中:

.globalStyle {
  color: #f0f;
}


index.wxml:

<view class="globalStyle">全局样式</view>


优先级


分别为:行内样式 > 页面样式 > 全局样式,如果想让其中的某一个样式达到最高可以利用之前 CSS 所学习的 !important 来实现。


行内样式 > 页面样式 > 全局样式:

<view style="color: red;" class="pageStyle globalStyle">行内样式</view>


页面样式 > 全局样式:

<view class="pageStyle globalStyle">页面样式</view>


!important:

.globalStyle {
  color: #f0f !important;
}


2105804-20230406223638243-240821008.png

目录
相关文章
|
7月前
|
小程序 前端开发 开发者
【微信小程序】-- WXSS 模板样式- rpx & import (十三)
【微信小程序】-- WXSS 模板样式- rpx & import (十三)
|
3月前
|
小程序 前端开发 中间件
ThinkPHP 配置跨域请求,使用TP的内置跨域类配置,小程序和web网页跨域请求的区别及格式说明
本文介绍了如何在ThinkPHP框架中配置跨域请求,使用了TP内置的跨域类`\think\middleware\AllowCrossDomain::class`。文章还讨论了小程序和web网页在跨域请求格式上的区别,并提供了解决方案,包括修改跨域中间件源码以支持`Origin`和`token`。此外,还介绍了微信小程序跨域请求的示例和web网页前端发送Axios跨域请求的请求拦截器配置。
ThinkPHP 配置跨域请求,使用TP的内置跨域类配置,小程序和web网页跨域请求的区别及格式说明
|
3月前
|
JSON 小程序 前端开发
towxml的使用,在微信小程序中快速将markdown格式渲染为wxml文本
本文介绍了在微信小程序中使用`towxml`库将Markdown格式文本渲染为WXML的方法。文章提供了`towxml`的概述、安装步骤、以及如何在小程序中配置和使用`towxml`进行Markdown解析的详细说明和代码示例。
|
6月前
|
Java C语言
Java微信语音amr格式转mp3格式
Java微信语音amr格式转mp3格式
|
5月前
|
存储 前端开发 Java
支付系统----微信支付17-----定义统一结果,返回时间格式不一样,怎样解决
支付系统----微信支付17-----定义统一结果,返回时间格式不一样,怎样解决
|
7月前
|
JavaScript 小程序
微信小程序 搜索框实现模糊搜索(带模拟数据,js,wxml,wxss齐全
微信小程序 搜索框实现模糊搜索(带模拟数据,js,wxml,wxss齐全
|
7月前
|
小程序
【微信小程序】-- WXSS 模板样式- 全局样式和局部样式(十四)
【微信小程序】-- WXSS 模板样式- 全局样式和局部样式(十四)
|
7月前
|
小程序 JavaScript 前端开发
【微信小程序】--WXML & WXSS & JS 逻辑交互介绍(四)
【微信小程序】--WXML & WXSS & JS 逻辑交互介绍(四)
|
7月前
|
前端开发 小程序
微信小程序中wxss和css的差异
微信小程序中wxss和css的差异
|
2月前
|
JSON 小程序 JavaScript
uni-app开发微信小程序的报错[渲染层错误]排查及解决
uni-app开发微信小程序的报错[渲染层错误]排查及解决
664 7