波浪动态图地址

动态图地址

.wxml

<view class="header"><image class="bg_ware" src="https://moyv.top/wechat/images/bg_wave.gif"></image>
</view>

.wxss

page{background-color: #fff;/**页面背景色**/
}
.header {/**顶部背景**/position: relative;/**相对于自己文档的位置来定位的，对旁边的元素没有影响**/height:750rpx;/**设置顶部背景高度**/background: linear-gradient(to bottom, #e9d7df, #eea6b7);/**渐变色背景**/
}
.bg_ware {/**波浪动态图**/position: absolute;/**相对于父标签来进行定位，这里的父标签的class是header**/left: 0;/**相对于父标签左边界重合**/bottom: 0;/**相对于父标签下边界重合**/width: 100%;/**相对于父标签宽度为100%**/mix-blend-mode: screen;/**透明部分用底部背景色填充，简称滤色**/height: 120rpx;/**图片高度**/
}

完成效果

微信小程序波浪动态效果和背景色渐变（使用动态图，有手就行，但是流动速度固定波浪数目也固定）相关推荐

微信小程序轮播图中间变大_微信小程序实现带放大效果的轮播图
本文实例为大家分享了微信小程序实现带放大效果的轮播图,供大家参考,具体内容如下效果如图 WXML WXSS .Carousel{ margin-top: 49px; background-color ...
微信小程序微商城（五）：动态API实现商品详情页（下）
IT实战联盟博客:http://blog.100boot.cn 上一篇:微信小程序微商城(四):动态API实现商品详情页(上) 看效果加入购物车.gif 开发计划 1.加入购物车悬浮框.商品数量.价 ...
微信小程序：开心锤锤超火动态表情包微信小程序源码下载自动采集
这是一款表情包小程序源码大家刷抖音的时候应该都刷过开心锤锤这个网红卡通短视频吧现在这一款小程序就是和它有关的里面的表情包呢大部分都是动态表情包(斗图的时候是不是更炫) 至于里面的表情包人物的就都 ...
微信小程序（4）——CSS3渐变
CSS3 渐变(gradients)可以在两个或多个指定的颜色之间显示平稳的过渡.CSS3 定义了两种类型的渐变(gradients): 1.线性渐变(Linear Gradients)- 向下/向上 ...
微信小程序实现顶部导航栏渐变
在小程序开发的过程中,会遇到一些页面上的要求,要求实现顶部导航栏的渐变如何实现,因为小程序做了一些封装,下面看看页面的布局图: 如图所示,实际上我们能够操作的页面只有中间那一块,那么,如果客户需要使用 ...
微信小程序自定义导航栏单独设置某些页面胶囊背景色，微信小程序setNavigationBarColor无效，微信小程序更改右上角按钮背景色
前言我们的小程序导航栏全局用的自定义导航,其中某两个页面的导航栏要有那种科技范儿,将导航栏背景设置成了透明背景,这样导航栏的背景色就跟着页面的背景走了,但是就是右上角的胶囊颜色不跟着变,用微信小程序 ...
微信小程序-仿淘宝(附真机测试图)（持续更新中。。。）
醉前端微信小程序已开始公测, 醉前端的开发热情依然不减... 这是仿手机淘宝做的微信小程序,目的在于享受开发,学习小程序,欢迎大家批评指正. demo资源地址:demo gihub传送门 tip: ...
微信小程序 - ＜image＞图片 src 路径动态拼接多个变量
前言在微信小程序中对于动态图像 src 路径,您无法像正常 Vue 项目那样拼接变量路径,这归结于小程序框架底层. 在正常 Vue 中,一个默认字符串和一个变量,很容易实现. 但在微信小程序中,您会 ...
uniapp 微信小程序配置全局主题色、实现动态修改主题色
前言: 本文的实现目标是全局配置小程序的整体主题色,包括本地图标的色调.第一步实现在本地可以统一修改整体的主题色以及本地图标的颜色:第二步实现通过后台接口动态调整小程序前端的整体主题色以及本地图标颜色 ...
微信小程序之图表系列——canvas绘制饼状图，带点击效果
一图胜千言,相信很多开发者都没有绕开过图表制作这个坑,在小程序中也是,当然可以用第三方echart等制图插件来做,但小程序要求代码量最大12M,还得分好几个包,一个echart插件就将近1M,要是只做 ...

微信小程序波浪动态效果和背景色渐变（使用动态图，有手就行，但是流动速度固定波浪数目也固定）

目录

波浪动态图地址

.wxml

.wxss

完成效果

微信小程序波浪动态效果和背景色渐变（使用动态图，有手就行，但是流动速度固定波浪数目也固定）相关推荐

最新文章

热门文章