济南房屋出售,儿童节祝福,女王脚奴视频
wxss(weixin style sheets)是一套样式语言,用于描述 wxml 的组件样式。
与 css 相比,wxss 扩展的特性有:
设备 | rpx换算px (屏幕宽度/750) | px换算rpx (750/屏幕宽度) |
---|---|---|
iphone5 | 1rpx = 0.42px | 1px = 2.34rpx |
iphone6 | 1rpx = 0.5px | 1px = 2rpx |
iphone6 plus | 1rpx = 0.552px | 1px = 1.81rpx |
建议: 开发微信小程序时设计师可以用 iphone6 作为视觉稿的标准。
注意: 在较小的屏幕上不可避免的会有一些毛刺,请在开发时尽量避免这种情况。
使用@import
语句可以导入外联样式表,@import
后跟需要导入的外联样式表的相对路径,用;
表示语句结束。
示例代码:
/** common.wxss **/ .small-p { padding:5px; }
/** app.wxss **/ @import "common.wxss"; .middle-p { padding:15px; }
框架组件上支持使用 style、class 属性来控制组件的样式。
<view style="color:{{color}};" />
.
,样式类名之间用空格分隔。<view class="normal_view" />
目前支持的选择器有:
选择器 | 样例 | 样例描述 |
---|---|---|
.class | .intro |
选择所有拥有 class="intro" 的组件 |
#id | #firstname |
选择拥有 id="firstname" 的组件 |
element | view |
选择所有 view 组件 |
element, element | view, checkbox |
选择所有文档的 view 组件和所有的 checkbox 组件 |
::after | view::after |
在 view 组件后边插入内容 |
::before | view::before |
在 view 组件前边插入内容 |
定义在 app.wxss 中的样式为全局样式,作用于每一个页面。在 page 的 wxss 文件中定义的样式为局部样式,只作用在对应的页面,并会覆盖 app.wxss 中相同的选择器。
如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复
css3 flex布局 justify-content:space-between 最后一行左对齐
网友评论