WXSS具备了CSS的大部分功能，小程序也在WXSS上做了一些扩展和修改。

添加了新的尺寸单位。在编写CSS样式时，开发人员需要考虑到移动设备的屏幕会有不同的宽度和设备像素比例，并使用一些技术来转换一些像素单位。 WXSS底层支持新的尺寸单位rpx。开发者可以免去转换的麻烦，直接交给小程序底层来做转换即可。由于转换使用浮点运算，计算结果会与预期结果略有不同。

提供全局样式和局部样式。 app.json 和 page.json 的概念与之前相同。你可以将app.wxss编写为全局样式，该样式将应用于当前小程序的所有页面。本地页面样式page.wxss只会在当前页面生效。

另外，WXSS仅支持部分CSS选择器。

更详细的文档请参考WXSS。

官方文档包括样式导入、内联样式和选择器。微信开发者需要看一下。 ****这里我分享一下我自己开发中的一些实用点。

自适应尺寸单位rpx

rpx()：可以根据屏幕宽度进行适配。将屏幕宽度指定为 。如上，屏幕宽度为750个物理像素，则==750个物理像素，1rpx=0.5px=1个物理像素。

rpx是微信定制的单位，在实际应用中非常好用，因为你不用担心不同的手机型号。有时候设置100%的时候可以直接设置。

内联样式的动态转换

静态样式写好之后，有时有些场景想根据不同的场景设置不同的样式。这样就可以在wxml中定义变量，在js中制定不同的样式。这在工作场景中非常实用。

伪选择器

当您刚接触样式时，很容易忽略样式伪元素，但它们使用起来很有趣。例如：： ， ：：

以下是两种场景： 1. 将箭头放在视图后面

使用：：

.arrow::after {

这里有一个垂直居中的小技巧，就是top:50%然后用-top减去一半，这里是-3px；

2. 在某些文本前面放置一条竖线

使用：：

.sessionHeader:before {

侨智科技：科技赋能梦想！专注广州、深圳、惠州小程序定制开发、APP应用定制开发、网站开发、区块链钱包开发！