扫码关注官方订阅号
像这种的效果是如何做出来的呢,球大神指点
走同样的路,发现不同的人生
如果你要的是圆形,那么可以先搞个正方形出来,然后给它加上border-radius:xxpx; 这个是一个角的圆弧的半径,然后它就变成了一个圈 如果里面的蓝色部分是平的我觉得再塞个长方形嵌在里面就可以了 有起伏的话大概就要嵌图片了 要是让我做的话我就会想到这么做...
不过如果你能发个哪里能看到它的地址,代码就一定可以扒出来´・ω・`
这个时候就打开“开发者工具”一般浏览器里按F12,我这里以chrome为例 左上角的小放大镜戳一下,对着你要扒的这个圆戳一下,保证选到的是整个圆 然后这时候开发者工具里面蓝色高亮的就是这个圆的html,代码copy下来 然后看右边的css,只要没有中划线的就照抄。 再一层层往你选中的圆里面的html看,继续抄css。 然后就可以了.......
以前看过网站有类似的效果,波浪层是用背景图片控制位移来实现,大概是这样的http://jsfiddle.net/yL2p02jy/
你的意思是做这种图片吗?还是。。。?
这个图应该是动态的,上面的水位可以一抖一抖,很萌的。 建议使用canvas或者SVG实现。 可以研究下three.js, D3.js等库
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
扫描下载App
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
如果你要的是圆形,那么可以先搞个正方形出来,然后给它加上border-radius:xxpx;
这个是一个角的圆弧的半径,然后它就变成了一个圈
如果里面的蓝色部分是平的我觉得再塞个长方形嵌在里面就可以了
有起伏的话大概就要嵌图片了
要是让我做的话我就会想到这么做...
不过如果你能发个哪里能看到它的地址,代码就一定可以扒出来´・ω・`
这个时候就打开“开发者工具”一般浏览器里按F12,我这里以chrome为例
左上角的小放大镜戳一下,对着你要扒的这个圆戳一下,保证选到的是整个圆
然后这时候开发者工具里面蓝色高亮的就是这个圆的html,代码copy下来
然后看右边的css,只要没有中划线的就照抄。
再一层层往你选中的圆里面的html看,继续抄css。
然后就可以了.......
以前看过网站有类似的效果,波浪层是用背景图片控制位移来实现,大概是这样的
http://jsfiddle.net/yL2p02jy/
你的意思是做这种图片吗?还是。。。?
这个图应该是动态的,上面的水位可以一抖一抖,很萌的。
建议使用canvas或者SVG实现。
可以研究下three.js, D3.js等库