rpx 第10页

uni-app尺寸单位

uni-app支持的通用的css单位包括px、rpx。px即屏幕像素rpx即响应式px，一种根据屏幕宽度自适应的动态单位。以750宽的屏幕为基准，750rpx恰好为屏幕的宽度。

马小超321·2023-08-23 22:21

模拟微信小程序加载动画

exportdefault{data(){return{};}}.container_app{position:fixed;width:100%;height:100%;}.circle{width:150rpx

T3165919332·2023-08-23 13:46

2.5 v-bind class style的动态绑定

的动态绑定v-bind对style的动态绑定exportdefault{data(){return{backgroundStyle:{backgroundColor:'#000000',width:'100rpx

flyjar·2023-08-23 02:18

微信小程序签名（横屏+竖屏）

横屏wxml清除确定wxss#firstCanvas{width:750rpx;height:600rpx;background-color:#fff;}jsconstapp=getApp()Page(

烂泥也能扶上墙·2023-08-22 23:33

02B 小程序的布局

scroll-page{height:100%}.city{width:204px;}用的是scroll-page组件,对它进行高度的设置,navigator是跳转组件.城市列表,个人中心2个跳转组件9移动端尺寸的适配rpx

卖参·2023-08-22 08:38

微信小程序：瀑布流使用float的问题

出现了问题和理想中的效果差距还是很大.content{width:48%;float:left;display:flex;justify-content:center;text-align:justify;margin-top:5rpx

幸思无声_东莞·2023-08-22 06:47

解决小程序底部input输入框键盘弹出使页面布局上移问题

效果如下动图：二、解决解决：参考链接：小程序input输入框键盘弹出使得布局上移问题_一天一天积累的博客-CSDN博客直接贴代码：wxml：分享发送wxss：.say{height:100rpx;bo

抄代码抄错的小牛马·2023-08-21 02:21

微信小程序弹框wx.showModal如何修改样式

弹窗添加数量取消确定/**index.wxss**/.show-btn{margin-top:100rpx;color:#22cc22;}.modal-mask{width:100%;height:100%

前端开发小吴·2023-08-20 18:00

10.小程序样式

样式css部分样式不支持，并且添加了rpx属性，小程序开发的时候应该使用rpx，而不是px，因为rpx是将移动端的屏幕大小分为750份，会自动按设备的大小去适配；我们在开发时应该以iphone6为基准的设备进行开发

河马开源·2023-08-20 18:57

uni-app使用swiper设置轮播图的圆角,滑动时变为直角的解决方法

uni-app使用swiper设置轮播图的圆角,滑动时变为直角的解决方法问题显示代码部分样式.ad-swiper{height:150rpx;.swiper{height:100%;.swiper-item

小火车况且况且·2023-08-20 16:29

微信小程序胶囊位置计算，避开胶囊位置

由于小程序在不同的手机上顶部布局会发生变化，不能正确避开胶囊位置，所以通过官方给出的胶囊信息，可以计算出胶囊位置，并避开图示例：此处思路是，获取胶囊底部位置，并拉开10个px计算出来的值一定要用px，不要用rpx

Garc·2023-08-20 15:30

微信小程序卡片横向滚动竖图

js代码：Page({data:{background:['图片地址1','图片地址2','图片地址3']}})wxss代码：.img-x{z-index:100;}.img-x-v{width:300rpx

Garc·2023-08-20 15:29

css 实现文字横向循环滚动

css部分.weather_info_wrap{width:90%;overflow:hidden;white-space:nowrap;font-size:24rpx;display:flex;}.weather_info

佛系努力中……·2023-08-19 23:32

小程序配置px2rem

小程序是rpx转rem,统一配置：npminstallpx2rpx-loaderconstpx2remLoader={loader:'px2rem-loader',options:{remUnit:75

船长在船上·2023-08-19 10:19

uniapp的坑

1、在pages.json里的titleNView或页面里写的plusapi中涉及的单位只支持px，不支持rpx2、tenplate内引入静态资源，比如图片，视频的src属性时，可以使用相对路径或者绝对路径

爱喝牛奶~·2023-08-19 07:42

uniapp tabbar 浏览器调试显示真机不显示

解决方案，把tabBar里面的单位全改为px，rpx是不会显示的！

奇怪的点·2023-08-19 01:51

px和rpx在线转换小工具

lemontree-xy·2023-08-18 19:17

微信小程序动态绑定style样式

达到动态渲染效果，如果样式比较复杂的话建议绑定动态class传送门：绑定动态class第一种，通过变量值直接绑定样式：JS:data:{homeOutObj:{color:'red',fontSize:'14rpx

前端攻城狮路飞·2023-08-18 13:36

小程序选项卡，tab导航栏

赵羽珩·2023-08-17 18:07

小程序CSS button按钮自定义高度之后不居中

问题：按钮设置高度后不居中Savepage{font-size:30rpx;}.btn1{margin-top:100rpx;height:190rpx;background:linear-gradient

Lan.W·2023-08-17 11:11

uniapp小程序横屏显示样式错乱

style":{"navigationBarTitleText":"横屏页面","pageOrientation":"auto"//支持auto/portrait/landscape}}正常样式横屏后放大，rpx

倘若hfl·2023-08-17 09:22

Flutter 宽高自适应

在Flutter开发中也需要宽高自适应，手动写一个工具类，集成之后在像素后面直接使用px或者rpx即可。

Johnny Tong·2023-08-17 08:11

糖豆甜呀甜·2023-08-16 17:44

微信小程序实现左滑删除

由于movable-view需要向右移动，左滑的时候给删除控件展示的空间，故movable-area需要左移left:-120rpx;，movable-view右移left:120rpx;。

人民的石头·2023-08-16 03:03

设置box-shadow无效的解决方案

给tab选项卡添加了box-shadow没有产生效果.wuc-tab{padding-left:12rpx;box-shadow:08rpx8rpx0rgba(0,0,0,0.21)!

它经不起推敲的·2023-08-15 11:59

vue使用三元表达式设置style，class

三元表达式设置style三元表达式设置styleexportdefault{data(){return{l_width:'100rpx',l_height:'100rpx',}}}二、设置class，1

也•简·2023-08-15 07:52

微信小程序（原生）搜索功能实现

一、效果图二、代码wxml搜索搜索历史清空历史{{item}}一共搜索出{{total}}产品11scss.history{padding:30rpx;.title{display:flex;justify-content

青田。·2023-08-15 06:10

微信小程序之button按钮自适应大小

在wxml中的button设置如下size=“mini”type=“default”class=“pingjia”style=‘width:150rpx;font-size:30rpx!

noveto·2023-08-15 05:30

【微信小程序】实现分页加载

木易早上·2023-08-14 09:51

微信小程序时钟

flex;flex-direction:column;align-items:center;justify-content:flex-end;height:22%;}.date-box{padding:20rpx0

古口古·2023-08-13 08:25

小程序swiper自定义分页器（指示点）样式

important;right:0;}.wx-swiper-dots.wx-swiper-dots-horizontal{margin-bottom:-5rpx;}/*方法二*/.wx-swiper-dots.wx-swiper

革易·2023-08-12 14:52

H5 文字单行显示

{{dailyHours}}.text-normal-line{width:calc(100%-130rpx);overflow:hidden;text-overflow:ellipsis;display

努力成为包租婆·2023-08-12 09:39

uni-app将rpx转px

sizeDeal(size){constinfo=uni.getSystemInfoSync()constscale=750/info.windowWidth;//分离字体大小和单位,rpx转pxlets

蓝之静云·2023-08-11 08:35

【CSS】背景图定位问题适配不同机型

一不下心容易错位实现因为飘带背景是版本迭代中更新的,所以飘带和渐变背景实则两个div飘带切图如下,圆形部分需要契合头像.box-bg{position:absolute;width:100%;height:900rpx

科科是我嗷~·2023-08-11 06:42

小程序条形倒计时动画

一、效果图如下：process.gif二、wxml倒计时：{{t}}三、wxss.headpiece-num{position:absolute;top:-3rpx;right:-35rpx;width

谭瞎·2023-08-11 06:30

uniapp 仿微信朋友圈点击评论唤起软键盘并自定义输入框占位符

，输入框内自定义占位符新建一个子组件，内容如下{{details}}保存exportdefault{data(){return{val:'',placeholderStyle:{padding:'30rpx0

北京的北京·2023-08-11 05:59

uni-app 自定义轮播图 swiper 指示点位置

项目需要把指示点位置上移，否则会被按钮遮盖……//设置轮播的指示点位置.swiper{/deep/.uni-swiper-dots{//指示点整个区域//bottom:100rpx;}}但是，上述设置指示点位置代码

北京的北京·2023-08-11 05:29

小程序：实现下拉框

300:selectData.length*60):0}}rpx;'>{{item}}2，wxsspage{background:#f3f7f7;}.select_box{background:#fff

Litzy_b986·2023-08-10 13:24

uniapp实现支付宝菜单展开与收起

代码：1.视图层首页应用第1行文字第2行文字第3行文字第4行文字第5行文字//展开菜单.showMenusBox{height:300px;margin:15rpx32rpx;}2

爱吃鱼的酱酱仔·2023-08-09 15:59

uni——tab切换

'}])constcurrent=ref(1)functionchangeTab(item){current.value=item.id}.tablist{display:flex;width:229rpx

耶啵奶膘·2023-08-09 01:22

uni——不规则tab切换（skew）

:2,name:'标题2'}])constcurrent=ref(1)functionchangeTab(item){current.value=item.id}.tabBoxs{margin:025rpx

耶啵奶膘·2023-08-09 01:48

uniapp实现点击切换样式

----{{item.title}}样式.item{border:solid;margin:5rpx;color:blue;}.itemact{border:solid;margin:5rpx;color

蓝胖子不是胖子·2023-08-08 18:37

微信小程序开发之大转盘抽奖

上代码:1.index.wxmlSTART2.index.wxss.container-out{height:600rpx;width:650rpx;background-color:#b136b9;margin

凉介Seven·2023-08-08 10:09

uni、css——制作表格样式的模型

案例展示这里以5列做展示（可随意调节）案例代码1.list{border:1pxsolidred;margin:24rpx;display:grid;grid-template-columns:repeat

耶啵奶膘·2023-08-08 06:32

小程序的api使用以及一些weui组件实列获取头像扫码等

今日目标响应式单位rpx小程序的生命周期【重点】20%小程序框架weui【重点】50%内置API【重点】30%综合练习1.响应式rpx1.1rpx单位rpx是微信小程序提出的一个尺寸单位，将整个手机屏幕宽度分为

quanmeiren·2023-08-08 05:01

小程序+wepy实现图片的抖动旋转效果

小程序+wepy实现图片的抖动旋转效果直接上代码样式.hongbao{width:90rpx;height:90rpx;}data中的变量data={animation:{},next:true,};在

江流儿吃油条·2023-08-06 20:28

微信小程序 width 100% 加 margin 或 padding 溢出屏幕

fill-available+marginwidth:100%;width:-moz-available;width:-webkit-fill-available;width:fill-available;margin:10rpx2

笑虾·2023-08-06 20:27

uniapp微信小程序横竖屏切换样式适配

1、rpx布局是不能直接实现的，写两套（横屏、竖屏）样式才可以达到想要的效果2、使用：百分比、rem、vw\vh、vmin\vmax、px（px布局在不同设备上有差异）都可以一套样式实现横竖屏适配二、本文重点说

停留的章小鱼·2023-08-06 00:34

记录uniapp 滚动后溢出显示空白的办法

写了一个横向滚动，超出可视区域图片空白，上下滚动页面可视区域图片显示，不可见区域滚动出来变成空白错误css如下width:678rpx;height:264rpx;background:#ffffff;

给钱，谢谢！·2023-08-05 07:35

flutter UI适配

rpxdoubletoRpx(BuildContextcontext,doublesize){doublerpx=MediaQuery.of(context).size.width/750;returnsize*rpx

毛小兔的头发还在吗·2023-08-04 07:12

推荐频道

rpx