文章 专题 AI工具 学习 下载 问答 源码 最近更新
PHP
会员中心 讲师中心 微信公众号
css - 请问这个页面是如何实现的？
阿神
阿神 2017-04-17 13:01:41
[HTML讨论组]
0 6 443
举报

截取自一个psd文件。
绿色的圈1 2 3如何制作呢？要切成三个小图吗？
这几个元素如何布局？

阿神
阿神

闭关修行中......

全部回复(6)
怪我咯
怪我咯2017-04-17 13:03:41 6楼

用p模拟圆很简单了，宽高一直，然后行高和高度一致，这样里面的数字就是垂直居中的，最后加个背景色和 border-radius:50%，一个圆就出来了

赞 +0
添加回复
阿神
阿神2017-04-17 13:03:41 5楼

圆圈： p border-radius:50%

赞 +0
添加回复
怪我咯
怪我咯2017-04-17 13:03:41 4楼

border-radius: 50%;
布局就p嵌套ul就好了啊

赞 +0
添加回复
伊谢尔伦
伊谢尔伦2017-04-17 13:03:41 3楼

绿色的圆是我的话直接做成图片 给ie8以下浏览器好看一点
这可不是那种轮播图片的切换按钮，这是 带圈文字啊~~ie8一降级圆成方块了。。难看不难看
或者，用图片字体也行，在字体里做一个空心圆，上面放文字

赞 +0
添加回复
大家讲道理
大家讲道理2017-04-17 13:03:41 2楼

1.p border-radius；
2.img
3.iconfont

赞 +0
添加回复
ringa_lee
ringa_lee2017-04-17 13:03:41 1楼

border-radius属性

赞 +0
添加回复
专题推荐
更多>
热门话题
热门教程
更多>
相关教程
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网：公益在线php培训，帮助PHP学习者快速成长！
关注服务号 技术交流群
app下载
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • PHP学习

  • 技术支持

  • 返回顶部