运动的八卦图

最新推荐文章于 2023-04-18 19:30:31 发布
最新推荐文章于 2023-04-18 19:30:31 发布
阅读量343 收藏
点赞数
分类专栏： HTML5
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yu9696/article/details/52048888
版权
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>八卦图</title>
    <style>
        /*矩形运动*/
        @keyframes gd{
            /*25%{transform:translateX(400px) rotate(-360deg);}*/
            /*50%{transform:translate(400px,300px) rotate(-760deg);}*/
            /*75%{transform:translate(0,300px) rotate(-1080deg);}*/
            /*100%{transform:translate(0,0) rotate(-1440deg);}*/




            100%{transform:rotate(360deg);}


        }
        /*绕圆运动*/
        @keyframes lb{
            100%{transform:rotate(3600deg);}
        }


        #yin-yang {
            margin: 58px;
            width: 96px;
            height: 48px;
            background: #eee;
            border-color: #000000;
            border-top: #eeeeee;
            border-bottom: #000000;
            border-style: solid;
            border-width: 2px 2px 50px 2px;
            border-radius: 100%;
            position: relative;
            animation:lb 5s linear infinite;


        }
        /*border-width 简写属性为元素的所有边框设置宽度，或者单独地为各边边框设置宽度。上 右 下 左*/






        #yin-yang:before {
            content: "";
            position: absolute;
            top: 50%;
            left: -2px;
            background: #eee;
            border: 20px solid #000000;
            border-radius: 100%;
            width: 12px;
            height: 12px;


        }
        #yin-yang:after {
            content: "";
            position: absolute;
            top: 50%;
            left: 52%;
            background: #000000;
            border: 18px solid #eee;
            border-radius:100%;
            width: 12px;
            height: 12px;
        }
        #mydiv{
            width: 500px;
            height: 500px;
            border: 1px solid #000000;
            border-radius: 300px;
            animation:gd 5s linear infinite;
        }
    </style>
</head>
<body>
<div id="mydiv">
    <div id="yin-yang"></div>
</div>
</body>
</html>
敢敢--
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
canvas学习day1——让矩形运动起来，构造函数的作用
weixin_41571938的博客
04-23 282
让矩形运动起来 非常简单，其实就是画一个矩形然后擦除，再画一个位移变动的矩形，不断重复即可。这里可以直接把绘制方法 改成 直接调用绘制矩形的JS API <body> <canvas id="cvs" width="500" height="500"></canvas> <script> var cvs = document.getElementById('cvs'); var ctx = cvs.getCont
纯HTML+CSS实现DIV做矩形运动
你的大数据学长
02-18 5513
纯HTML+CSS实现DIV做矩形运动预计效果代码关键代码解释结果展示 预计效果 代码 该代码可在我的GitHub中找到，链接在此 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>DIV做矩形运动</title> ...
描述矩形在二维坐标的运动和变化
smartresister的专栏
04-26 364
1）描述运动，用矩形的中心坐标的变化来； 2）描述矩形的变化，变大和变小，用边界的坐标，x轴的宽度（x2-x1），Y轴的高度(Y2-Y1) 思考：这个矩形的描述最小粒度，可以用两个特性的相同的一维组合的描述，简单的相组合就会描述二维的矩形； 一维的数据是最小度量单位。 所以2个一位数据的描述来描述变化；中心坐标的变化，用来描述移动；而中心坐标可以由每个一位数据的起点和终点的来描述，即（x1+x2）/2 ...
python画太极八卦图_先天太极八卦图的唯一正确画法
weixin_32187691的博客
12-30 2036
我们先百度一下先天太极八卦图.↑，看看结果百度出来的图片第一页上半部分，结果非常惊人，40张图片，没有一张是正确的。错误原因分为两大类：1.太极图旋转方向或阴阳鱼所在位置错误 2.八卦中每卦的三爻画法错误1. 先天太极八卦图的太极是顺时针旋转；阴阳鱼位置是：阳鱼在上，阴鱼在下，阴阳鱼眼在同一条水平线上(PS:太极图有人喜欢用古画法，有人习惯用流通最广的画法，两种我都列出，但我习惯用流通最广最常见的...
八卦与十二地支方位图_[天干地支五行八卦图] 天干地支八卦方位图
热门推荐
weixin_39548787的博客
12-19 1万+
或许很多人在路上就会遇到很多算命的师傅，他们说些天干地支，五行八卦的东西，到底是什么意思呢?小编整理了五行八卦天干地支图，希望大家有所收获!天干地支五行八卦图介绍天干一.十天干甲、乙、丙、丁、戊、己、庚、辛、壬、癸二.所属五行、阴阳甲乙同属木,甲为阳,乙为阴丙丁同属火,丙为阳,丁为阴戊己同属土,戊为阳,己为阴庚辛同属金,庚为阳,辛为阴壬癸同属水,壬为阳,癸为阴三.十天干属性：甲木，纯阳之木，名为大...
Python画图2（八卦阵等）
we123aaa4567的博客
04-18 2104
今天继续来用turtle库画图。
WPF太极八卦程序
bcbobo21cn的专栏
02-22 1958
1 八卦 <Window x:Class="Transform1.eightWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="eightWindo...
python画八卦_python编程也能八卦?
weixin_39620001的博客
12-05 741
python编程也能八卦?是的，而且能让八卦的逼格瞬间提升，今天python培训班就以运动员美好身材鉴赏指南为例，为你解读如何用python编程正经地八卦。如果有10个人关注“体育赛事”那就有100个人关注“体育明星”如果有10个人关注羽生结玄能否完成“勾手四周跳”那就有100个人关注羽生结玄优雅的肉体八卦的力量是无穷的 !那么身为一个在职场打拼、会抓热点、有技术控的编辑，怎样做一次不妖艳，不从众...
Get清风数控铣床笑脸、五角星、八卦程序.pdf
11-16
G01、G02、G03等指令用于控制机器人的线性运动、圆弧运动和helical interpolation运动。 5. 编程实例分析 在提供的文件中，我们可以看到三个编程实例： * 编程练习一：使用端面铣刀铣处上表面，对到，建立工作...
数控铣床笑脸五角星八卦程序.pdf
12-01
标题中的“数控铣床笑脸五角星八卦程序.pdf”表明这是一个关于使用数控铣床进行特定形状加工的程序，包括笑脸、五角星和八卦图案。这些程序通常由一系列的G代码和M代码组成，用于控制机床的动作。 描述中提到的是两...
时间罗盘(类型八卦的时间罗盘).zip
02-13
同时，还需要设计相应的算法来决定如何在屏幕上动态地旋转和变换这些符号，以模拟时钟指针的运动。 在设计图形用户界面（GUI）时，开发者可能使用了如Qt、wxPython或HTML5的Canvas等库，它们提供了丰富的图形绘制...
布朗运动与金融数学：百年征途
量化交易研究
07-24 6676
作者：郑连虎 来源：阿虎定量笔记 正文： 巴舍利耶：金融数学之父 ——要点：布朗运动、有效市场假说 即使在信息爆炸的今天，想要了解法国数学家路易斯·巴舍利耶（Louis Bachelier，1870-1946）的生活，依然缺乏资料。同许多思想超前的开拓者一样，巴舍利耶的研究成果在当时未能引起学界重视，直至50多年后被保罗·萨缪尔森...
高分项目-红包抽奖v版小程序源码（优秀毕业设计源码）.zip
08-30
1. 精选系统小程序代码说明：经导师指导并认可通过的98分毕设项目代码。 2.适用对象：本代码学习资料适用于计算机、电子信息工程、数学等专业正在做毕设的学生，需要项目实战练习的学习者，也适用于课程设计、期末大作业。 3.技术栈：java，项目代码都经过严格调试，代码没有任何bug！ 4. 作者介绍：大厂码农，java领域创作者，阿里云开发社区乘风者计划专家博主，专注于大学生项目实战开发，文章底部有博主联系方式，更多优质系统、项目定制请私信。 5. 最新计算机软件毕业设计选题大全: https://blog.csdn.net/weixin_45630258/article/details/135901374
1999-2022年中国基本单位统计(全新整理)
08-30
1、资源内容地址：https://blog.csdn.net/2301_79696294/article/details/141336945 2、代码特点：今年全新，手工精心整理，放心引用，数据来自权威，相对于其他人的控制变量数据准确很多,适合写论文做实证用 ，不会出现数据造假问题 3、适用对象：大学生，本科生，研究生小白可用，容易上手！！！ 3、课程引用: 经济学，地理学，城市规划与城市研究，公共政策与管理，社会学，商业与管理 制定政策的参考,也是企业生产经营及投资决策和科研机构、大专院校进行科研及教学活动的辅助资料。
Java项目：基于SSM框架+mysql实现的楼房销售系统含源码和毕业论文（ssm+mysql+jsp+b/s+maven）
08-30
一、项目简介 本项目是一套基于SSM框架+mysql楼房销售系统含源码和毕业论文 包含：项目源码、数据库脚本等，该项目附带全部源码可作为毕设使用。 二、技术实现 jdk版本：1.8 及以上 ide工具：IDEA或者eclipse 数据库: mysql5.5及以上 后端：spring+springmvc+mybatis+maven+mysql 前端：jsp，css，js 三、系统功能 1、系统角色主要包括：管理员、员工、客户 2、系统功能 主要功能包括： 首页 个人中心 修改密码 个人信息 员工管理 客户管理 房屋管理 房屋留言管理 房屋收藏管理 房屋订单管理 新闻管理 单页数据管理 户型类型管理 新闻类型管理 轮播图管理 前台主要功能包括： 用户登录 用户注册 首页 楼盘介绍 公司介绍 房屋信息展示 房屋详情 点我收藏 立即预订 发表留言 新闻资讯 个人中心 房屋收藏 房屋订单 跳转到后台等功能
高分项目-高的地图实时天气小程序源码（优秀毕业设计源码）.zip
08-30
1. 精选系统小程序代码说明：经导师指导并认可通过的98分毕设项目代码。 2.适用对象：本代码学习资料适用于计算机、电子信息工程、数学等专业正在做毕设的学生，需要项目实战练习的学习者，也适用于课程设计、期末大作业。 3.技术栈：java，项目代码都经过严格调试，代码没有任何bug！ 4. 作者介绍：大厂码农，java领域创作者，阿里云开发社区乘风者计划专家博主，专注于大学生项目实战开发，文章底部有博主联系方式，更多优质系统、项目定制请私信。 5. 最新计算机软件毕业设计选题大全: https://blog.csdn.net/weixin_45630258/article/details/135901374
A-simple-start-for-any-STM32-based-project.-STM32-base.zip
最新发布
08-30
anaconda安装 A_simple_start_for_any_STM32_based_project._STM32-base.zip A_simple_start_for_any_STM32_based_project._STM32-base.zip A_simple_start_for_any_STM32_based_project._STM32-base.zip A_simple_start_for_any_STM32_based_project._STM32-base.zip A_simple_start_for_any_STM32_based_project._STM32-base.zip A_simple_start_for_any_STM32_based_project._STM32-base.zip
python 八卦图
11-24
以下是使用Python画出太极阴阳八卦图的代码和效果演示： ```python import turtle # 设置画布大小和背景颜色 turtle.setup(800, 800) turtle.bgcolor("black") # 定义画圆弧的函数 def draw_arc(radius, angle): ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值