uni-popup修改默认样式 圆角

最新推荐文章于 2025-03-18 21:46:22 发布
最新推荐文章于 2025-03-18 21:46:22 发布
阅读量4.8k 收藏 2
点赞数 8
文章标签： 前端框架
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_71462678/article/details/129473331
版权
uni-popup的圆角样式修改并不直接通过.popup-content实现，实际上需要修改其外部层的样式。通过调整外部层的CSS属性可以成功设置圆角。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

uni-popup设置圆角看到官方案例以为是修改类名.popup-content样式，其实不是的，.popup-content外面还有一层 按以下修改即可修改圆角样式

释怀.913
关注
uni-app实战之社区交友APP（10）登录、个人空间开发和动画优化
CUFEECR的博客
02-06 1308
开发登录页，并配置顶部返回图标；构建登录页UI；实现验证码登录和账号密码登录切换；对登录表单进行验证，包括未输入禁用按钮、限制验证码点击频率、验证手机号码格式等；第三方登录使用接口。个人空间入口为帖子头像；开发头部组件；个人空间选项卡包括主页、帖子和动态；实现点击选项卡内容动态切换；实现点击右上角菜单按钮弹出操作菜单。通过接口获取缓存信息和清除缓存；新建JS文件用于保存全局配置和工具函数，同时在main.js中挂载；使用接口来获取和监听网络状态；用工具函数实现热更新；给帖子列表和消息列表添加动画效果。
uni-app实战之社区交友APP（8）搜索列表页和文章详情页开发
CUFEECR的博客
02-02 1257
不同页面的搜索类型不同，通过标识加以区别，搜索页完善搜索类型和占位符；根据不同的搜索类型搜索不同的内容，通过页面传递的搜索类型来实现。帖子详情页配置右上角的菜单按钮，入口是公共列表；使公共列表组件兼容到帖子详情页头部，实现复用，给评论和分享按钮添加点击事件；在详情页实现关注和顶踩功能；给帖子数据增加content和images字段，显示在父组件中；评论输入框参考聊天页输入框，将输入框抽离成组件；评论列表组件使用官方模板；分享功能使用uni-popup组件实现，从底部弹出，封装为组件，实现多种分享接口。
uniapp组件库Popup 弹出层 的使用方法
精通前端技术，了解后端接口
01-20 8893
弹出层容器，用于展示弹窗、信息提示等内容，支持上、下、左、右和中部弹出。组件只提供容器，内部内容由用户自定义。
修改 uni-popup 弹出层的圆角
red_HTML的博客
06-28 1050
修改圆角其实不是修改 uni-popup 的圆角 ，修改的是。将 uni-popup 里面的 view 标签设置白色背景 圆角。只是把 uni-popup组件的背景设置成。上面的view设置成白色背景在设置圆角。
如何封装uni.showModal和uni.showTost方法？(显示模态弹窗和提示框)
最新发布
qq_56746297的博客
03-18 126
如何封装uni.showModal和uni.showTost方法？(显示模态弹窗和提示框)
Unipop 开源项目常见问题解决方案
gitblog_00193的博客
01-27 367
Unipop 开源项目常见问题解决方案 unipop Data Integration Graph 项目地址: https://gitcode.com/gh_mirrors/un/unipop ...
uniapp弹出层改圆角
狗狗狗亮的博客
04-26 5031
将弹出层背景设为透明，然后在里面元素设白色背景并添加圆角。
uniapp 封装弹窗组件（popup ，可以修改弹窗按钮名，显示内容）
lanbaiyans的博客
04-27 4335
项目中使用了多个弹窗，且内容不一样，于是重新进行封装（避免后期样式大改）其中：图片，文字 按钮名 功能 都可以自定义（父子相互传值）注意:按钮可以不传 默认是 “确认”,"取消"
uni-app弹出层uni-popup使用以及修改默认样式
热门推荐
lsjweiyi的博客
03-31 3万+
uni-popup官方文档 我这里的背景是弹出一个选择规格的菜单。使用vue3+ts，使用组合式api 首先看看在vue3+ts+setup下的使用的使用： <template> <!-- 定义一个按钮，用于打开弹出层 --> <view style="width: 200px"> <button @click="openSpecs">弹出</button> </view> <!--
小程序uniapp 圆角css设置
qq_36712111的博客
08-04 2244
小程序uniapp 圆角css设置
uni-popup-dialog的type
05-18
uni-popup-dialog是uni-app中的一个弹窗组件，其中type属性用于设置弹窗的类型，可以设置以下值： - default：默认类型，无特殊样式。 - ios：iOS风格的弹窗，带有圆角和阴影效果。 - android：Android风格的弹窗，...
uni-data-picker自定义样式
02-21
#### 方法一：通过 CSS 类名覆盖默认样式 可以在页面的 `.css` 文件中定义新的类名，并将其应用到 `uni-data-picker` 组件上。 ```html <view class="custom-container"> <uni-data-picker v-model=...
uni.showModal更改边框圆角更改样式
m0_70782896的博客
12-14 1401
官方文档没有更改样式的说明，所以直接dom获取更改样式，百度找了好久没有找到合适的方法只能这样简单粗暴的解决了，如果哪位大佬有更好的方法，欢迎指点。
uniapp圆角
weixin_46073823的博客
11-21 6516
指定背景颜色的元素圆角： { border-radius: 25px; background: #fff; padding: 20px; width: 100px; height: 100px; } 指定边框的元素圆角: { border-radius: 25px; border: 2px solid #8AC007; padding: 20px; width: 100px; height: 100px; } 指定背景图片的元素圆角: { border-radius: 25px; backgro..
uniapp 使用 popup 弹出 阴影下内容会滚动
文木博客
04-18 328
【代码】uniapp 使用 popup 弹出 阴影下内容会滚动。
uniapp底部弹出层(uni-popup)使用技巧
m0_63553261的博客
03-01 5706
uniapp底部弹出层(uni-popup)使用技巧
uni-app开发popup弹出层的二级嵌套使用和修改popup默认样式
WhyBecause的博客
08-01 1万+
一、popup的使用（可参考uni-app开发文档） <template> <view class="content"> <button @tap="startOpen">打开弹窗按钮</button> </view> <!-- 第一个弹窗 --> <uni-popup ref="...
uni-app popup的使用方法
GDBBader的博客
03-30 7113
一、例子 ... <uni-popup id="popup" ref="popup" type="top" :animation="false" @change="change"> <scroll-view scroll-y="true" style="background-color: white;height: 1000rpx;width:710rpx;margin: 20rpx;border-radius: 10px;"> <view class=
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值