• 博客园logo
  • 会员
  • 众包
  • 新闻
  • 博问
  • 闪存
  • 赞助商
  • HarmonyOS
  • Chat2DB
    • 搜索
      所有博客
    • 搜索
      当前博客
  • 写随笔 我的博客 短消息 简洁模式
    用户头像
    我的博客 我的园子 账号设置 会员中心 简洁模式 ... 退出登录
    注册 登录
 






安然(o'~'o)

 
 

Powered by 博客园
博客园 | 首页 | 新随笔 | 联系 | 订阅 订阅 | 管理

2018年11月29日

CSS实现太极图(1个div实现)
摘要: 使用一个div实现太极图的步骤如下: HTML部分: 第一步,结合border实现左黑右白的正方形,加上圆角、阴影。代码如下; 效果如下: 第二步,通过伪类,实现一个一个白色的圆形,定位好位置。同时,利用box-shadow:0 200px 0 #000;实现同样大小的圆,放好。 先后实现的效果如下 阅读全文
posted @ 2018-11-29 22:24 安然(o'~'o) 阅读(3642) 评论(0) 推荐(1)
 
CSS实现太极图(3个div实现)
摘要: 使用三个div实现太极图的步骤如下: HTML部分 第一步,画一个宽高为300px的圆,并为其加上阴影(为了看起来有立体感) /*animation:rotation 2.5s linear infinite; -webkit-animation:rotation 2.5s linear infin 阅读全文
posted @ 2018-11-29 21:55 安然(o'~'o) 阅读(3404) 评论(0) 推荐(1)