wxss

WXSS, short for WeChat Style Sheets, is the stylesheet language used to style WeChat Mini Programs. It is an extension of CSS designed for the WeChat ecosystem and is used together with WXML templates and WXS scripts. WXSS files have the .wxss extension and are loaded for each page, with the possibility of defining global styles in app.wxss.

A central feature of WXSS is the rpx unit, a responsive pixel that scales with the device’s screen width to help build layouts that adapt across devices. The framework also allows traditional CSS units such as px. In practice, WXSS supports CSS-like selectors and properties, allowing developers to apply styles to tags, classes, and ids, while also enabling WeChat-specific style rules and constraints defined by the platform.

Styling in a mini program is organized with scope in mind. Global styles can be placed in app.wxss and apply across pages, while page-specific styles reside in each page’s own wxss file. The WeChat developer tools compile WXSS during the build process, translating it into code that runs within the Mini Program environment. While WXSS adopts the familiar CSS model, it is a distinct, platform-specific styling layer with features tailored to WeChat’s rendering and design guidelines.

Overall, WXSS provides CSS-like styling for WeChat Mini Programs, prioritizing responsive design through rpx, clear separation of global and page-level styles, and integration with the WXML/WXS stack.