红酒网站建设策划书,建设网站公司 昆山,兰州做网站,网站免费部署微信小程序day02 学习笔记wxss模板样式--介绍wxss简介wxss和css的关系 wxss模板样式--rpx什么是rpxrpx实现原理rpx与px单位换算(了解即可) wxss模板样式--样式导入什么是样式导入import的语法格式 WXSS 模板样式 - 全局样式和局部样式全局样式局部样式 小结 这段时间有部分小伙… 微信小程序day02 学习笔记wxss模板样式--介绍wxss简介wxss和css的关系 wxss模板样式--rpx什么是rpxrpx实现原理rpx与px单位换算(了解即可) wxss模板样式--样式导入什么是样式导入import的语法格式 WXSS 模板样式 - 全局样式和局部样式全局样式局部样式 小结 这段时间有部分小伙伴在问有没有什么好的刷题网站 在这里给大家推荐一款刷题网站点击访问牛客网 牛客网支持多种编程语言的学习各大互联网大厂面试真题从基础到拔高快来体验一下吧 学习笔记 阿里云盘 : https://www.aliyundrive.com/s/5Zrfw9EpKwa 提取码:37sc wxss模板样式–介绍
wxss简介
WXSS (WeiXin Style Sheets)是一套样式语言用于美化 WXML 的组件样式类似于网页开发中的 CSS。
wxss和css的关系 WXSS 具有 CSS 大部分特性同时WXSS 还对 CSS 进行了扩充以及修改以适应微信小程序的开发。与 CSS 相比WXSS 扩展的特性有 rpx尺寸单位import样式导入 wxss模板样式–rpx
什么是rpx
rpxresponsive pixel是微信小程序独有的用来解决屏适配的尺寸单位。
rpx实现原理
rpx 的实现原理非常简单鉴于不同设备屏幕的大小不同为了实现屏幕的自动适配rpx 把所有设备的屏幕在宽度上等分为 750 份即当前屏幕的总宽度为 750rpx。 在 较小 的设备上 1rpx 所代表的宽度较小在 较大 的设备上 1rpx 所代表的宽度较大 小程序在不同设备上运行的时候会自动把 rpx 的样式单位换算成对应的像素单位来渲染从而实现屏幕适配.
rpx与px单位换算(了解即可)
在iphone6上屏幕宽度为375px共有750个物理像素等分为750rpx,则: 750rpx 375px 750物理像素 1rpx 0.5px 1物理像素
wxss模板样式–样式导入
什么是样式导入
使用 WXSS 提供的 import 语法可以导入外联的样式表。
import的语法格式
import 后跟需要导入的外联样式表的相对路径用 ; 表示语句结束。示例如下
WXSS 模板样式 - 全局样式和局部样式
全局样式
定义在 app.wxss 中的样式为全局样式作用于每一个页面。
局部样式
在页面的 .wxss 文件中定义的样式为局部样式只作用于当前页面。 ① 当局部样式和全局样式冲突时根据 就近原则局部样式会 覆盖 全局样式 ② 当局部样式的 权重大于或等于 全局样式的权重时才会覆盖全局的样式 小结 小程序中的wxss其实与css并没有太大的差别小程序中rpx可以更好的适应不同的屏幕比例就像css的rem一样。
