『壹』 微信小程序 checkbox 怎么变小

style="transform:scale(.7)"

『贰』 设计微信小程序是按照什么尺寸做

rpx单位抄是微信小程序中css的尺寸单位，rpx可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在 iPhone6 上，屏幕宽度为375px，共有750个物理像素，则750rpx = 375px = 750物理像素，1rpx = 0.5px = 1物理像素。

设备
rpx换算px (屏幕宽度/750)
px换算rpx (750/屏幕宽度)

iPhone5 1rpx = 0.42px 1px = 2.34rpx
iPhone6 1rpx = 0.5px 1px = 2rpx
iPhone6s 1rpx = 0.552px 1px = 1.81rpx
微信小程序也支持rem尺寸单位，rem和rpx的换算关系：rem: 规定屏幕宽度为20rem；1rem = (750/20)rpx
注：开发微信小程序时设计师可以用 iPhone6 作为视觉稿的标准。
建议：设计稿使用设备宽度750px比较容易计算750px的话1rpx=1px，这样的话，设计图上量出来的尺寸是多少px就是多少rpx，至于在不同的设备上实际上要换算成多少个rem就交给小程序自己换算

『叁』 微信小程序 rpx和px的区别

rpx单位是微信小程序中css的尺寸单位，rpx可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在 iPhone6 上，屏幕宽度为375px，共有750个物理像素，则750rpx = 375px = 750物理像素，1rpx = 0

『肆』 微信小程序的屏幕像素比是怎么算出来的

尺寸单位

rpx（responsive pixel）: 可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在 iPhone6
上，屏幕宽度为375px，共有750个物理像素，则750rpx = 375px = 750物理像素，1rpx = 0.5px = 1物理像素。
设备 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

『伍』 微信小程序动画中如何将rpx转化px

正常对比 1rpx =2px
在正常的流程中 rpx 小程序会根据屏幕分辨率自动调整

『陆』 微信小程序盒子上面怎么消除间隙

1；vertical-align: top; 就可以来了源或者在 .surfaceTopImage 里面加 上 vertical-align: middle;
2；用flex布局（推荐）
.surfaceTop {display: flex;flex-direction: row;align-items: center;}

『柒』 微信小程序怎么引入外部的wxss

一、引入模板

小程序提供了两个引入外部模板的方法：import和include

使用外部模板可以实现大部分共同页面的代码利用，在一个app中，头部和脚部基本不会
变动太大，这时就可以通过模板的方式引入，实现多个页面的复用。
1.1 import

示例：

<!--view.wxml-->
<template name="view">
<text>{{text}}</text>
</template>
1
2
3
4
引入：

<import src="view.wxml"/>
<template is="view" data="{{text: 'forbar'}}"/>
1
2
注意：import有作用域，即import引入的模板只在当前页面有效，即import不会向下查找另外的模板
1.2 include

include标签可以看作是对 “html”的一个拷贝，即将外部的wxml片段拷贝进文档中
示例：
外部wxml片段

<!-- header.wxml -->
<view> header </view>
<!-- footer.wxml -->
<view> footer </view>
1
2
3
4
<!-- index.wxml -->
<include src="header.wxml"/>
<view> body </view>
<include src="footer.wxml"/>
1
2
3
4
5
总结：import是引入模板片段，且有作用域限制，不能进行模板嵌套。include是引入wxml片段，相当于代码拷贝。
二、WXSS 微信样式表

小程序中，页面样式的渲染通过wxss文件实现，.wxss可以看成是css，因为它们都在实现相同的功能。实质上wxss也是在css的基础之上进行了扩充和修改得到的。
wxss在css上的扩展特性：
1）、尺寸单位：rpx
rpx：是一个相对像素单位，可以根据屏幕宽度进行自适应。
针对移动端的开发，设计稿一般都是以iphone6为标准的。而iphone用的是视网膜屏，即我们css中设定的1px，在iphone上实际是由2px*2px的像素点组成的。
以iphone6为准，屏幕宽度375px，共有750个物理像素，则750rpx=350px,即1rpx=0.5px
2）、样式导入 @import
跟在css中的外部样式表的导入类似
@import "common.wxss";

『捌』 小程序中字体大小用rpx 还是px好

关于是否使用rpx还是px，首先需要明白两者之间的区别。

rpx：微信小程序中的尺寸单位rpx(responsive pixel):可以根据屏幕宽度进行自适应。规定屏幕宽度为750rpx。微信官方建议视觉稿以iphone6为标准，一般设计师出图为2倍图。

px：iphone6上1px=2rpx

1rpx相当于1个物理像素，何为物理像素，就相当于我们所使用的屏幕的尺寸，只不过换了一种说法叫物理像素，而我们平时css中所用到的px,实际上是数据显示的尺寸，比如文字，图片、设计样式的盒子的大小1rpx的出现为我们搭起了物理像素与样式像素px之间的桥梁，而且根据屏幕宽度进行自适应

<view class="box">rpx的像素</view>

<view class="bo">px的像素观察</view>

.box{width:300rpx;height:200rpx;border:1rpx solid black;font-size:30rpx;}.bo{width:300px;height:200px;border:1px solid black;font-size:30px;}

结果：

所以，小程序中字体大小用rpx还是px要结合设计师出图的文字大小，建议的话还是以rpx为主。

『玖』 怎么去掉 小程序demo的版权信息

这里提供给大家一个最简单的微信小程序示例Demo。
用到了倒仰样式、Text组件、View组件和JS代码的交互，大家要理解WXML、JS、WXSS和JSON文件的用途及相互关系。

新建项目，然后在index.wxml页面中创建相关控件
[XML] 纯文本查看 复制代码
?
01
02
03
04
05
06
07
08
09
10
<!--创建一个蓝色背景的View，添加点击事件,并输出启动日志-->
<view bindtap="bindViewTap" class="myView">
<text class="myView-clickK">点我点我</text>
</view>

<!--创建了一个text标签，然后执行了JS交互，通过两个大括号，在index.js中进行赋值-->
<view class="usermotto">
<text class="user-motto">{{motto}}</text>
</view>
</view>

然后在index.wxss文件中设计控件位置和属性样式，注意：
/**rpx单位是微信小程序中css的尺寸单位，rpx可以根据屏幕宽度进行自适应。
规定屏幕宽为750rpx。如在 iPhone6 上，屏幕宽度为375px，共有750个物理像素，
则750rpx = 375px = 750物理像素，1rpx = 0.5px = 1物理像素。开发建议：
开发微信小程序时设计师可以用 iPhone6 作为视觉稿的标准。UI设计图建议：使用
设计稿使用设备宽度750px比较容易计算750px的话1rpx=1px，这样的话，设计图上量出
来的尺寸是多少px就是多少rpx**/
具体代码如下：
[CSS] 纯文本查看 复制代码
?
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
.myView{
width: 200rpx;
height: 200rpx;
margin-top: -100rpx;
background-color: blue;
}
.myView {
display: flex;
flex-direction: column;
align-items: center;
width: 200rpx;
height: 200rpx;
margin: 20rpx;
border-radius: 50%;
}
.myView-clickK {
margin-top: 75rpx;
height: 50rpx;
color: red;
}
.usermotto {
margin-top: 100rpx;
}

对应页面的交互功能逻辑写在index.js文件中，如下所示：
[JavaScript] 纯文本查看 复制代码
?
1
2
3
4
5
6
7
8
9
data: {
motto: 'Hello World，你好，世界！'
},
//事件处理函数
bindViewTap: function() {
wx.navigateTo({
url: '../logs/logs'
})
},

设置导航样式，需要在app.json中进行设置

效果展示：

打击可以看到，当我们点击蓝色区域的【点我点我】，在其下方会出现'Hello World，你好，世界！'这些文字。这就是最简单的触碰事件及其处理效果的示例。

更多内容，请关注后续的教程。

『拾』 微信小程序滑动选择器怎么实现

组件说明：
picker：
滚动选择器，现支持三种选择器，通过mode属性来区分，分别是普通选择器(mode = selector)，时间选择器(mode = time)，日期选择器(mode = date)，默认是普通选择器。