38,219被浏览1,278,504分享邀请回答plt.fill(x, y1, 'b', x, y2, 'r', alpha=0.3)
以及这种 Scatter 图（中文不知道该怎么说…）：plt.scatter(x, y, s=area, alpha=0.5)
精致的曲线，半透明的配色。都显出你那高贵冷艳的X格，最重要的是只需一行代码就能搞定。从此以后再也不用忍受 Matlab以及GNUPlot 中那蛋疼的配色了。想画 3D 数据？没有问题 (不过用 mayavi 可能更方便一些)：ax.plot_surface(X, Y, Z, rstride=8, cstride=8, alpha=0.3)
cset = ax.contourf(X, Y, Z, zdir='z', offset=-100, cmap=cm.coolwarm)
cset = ax.contourf(X, Y, Z, zdir='x', offset=-40, cmap=cm.coolwarm)
cset = ax.contourf(X, Y, Z, zdir='y', offset=40, cmap=cm.coolwarm)
四行代码你就能拥有（后三行是画坐标平面上的等高线，严格的额说还是一行）。除此以外，不过你是矢量场，网络还是什么奇葩的需求都能够搞定：plt.streamplot(X, Y, U, V, color=U, linewidth=2, cmap=plt.cm.autumn)
plt.colorbar()
plt.triplot(x, y, triangles, 'go-')
plt.title('triplot of user-specified triangulation')
plt.xlabel('Longitude (degrees)')
plt.ylabel('Latitude (degrees)')
ax = plt.subplot(111, polar=True)
bars = ax.bar(theta, radii, width=width, bottom=0.0)
这还没完，Matplotlib 还支持Latex公式的插入，当别人画的图还是这个样子的时候（以下图片引用自）你能够把它变成这个样子：如果再搭配上 IPython 作为运行终端（这张图是自己的~）：简直就是神器啊，有木有！心动不如行动，还等什么？（奉上教程一篇 ）==== Update:
18:04 ====经同学提醒，再补充一句，matplotlib 还可以话 xkcd 风格的图呦~（图片引用自网络）此外结合 IPython Notebook 后更多精彩内容，请看==== Update:
20:04 ====如果嫌安装麻烦并且恰好在 Windows 系统下的话可以尝试Python的一个发行版。==== Update:
23:45 ====鉴于同学质疑 matplotlib 是否能画出题目中所示的图像，我在这里将题目中的图像用 matplotlib 画出来如下：代码在此处：代码在此处：======== 更新======看到楼下有人说配色和好看，唉....那我也贴几个吧...只不过当初限于篇幅没有写而已。首先，python 有一个专门的配色包，提供了从美术角度来讲的精美配色（戳这里感受）。此外还有一些致力于美化绘图的库，用起来也都非常方便，比如。废话不多说，上图就是王道。（一下图片来源网络）有人可能会说需要复杂的设置，其实也不用。比如上边这幅图，只需要多加一个参数就好：cmap=brewer2mpl.get_map('RdBu', 'diverging', 8, reverse=True).mpl_colormap,
楼下说到统计绘图。嘛 seaborn () 是一个调用 matplotlib 的统计绘图库，上图：代码一行，后边的几乎都是一行，没做其他设置，默认就这样。我就不贴其他的代码了：g = sns.jointplot(x1, x2, kind="kde", size=7, space=0)
这还有个更炫酷的可交互式的绘图，大家自己戳开看吧哼哼，完爆了吧~~~~\(≧▽≦)/~6K333 条评论分享收藏感谢收起bugman123.com/index.html 这哥们的 visualization 能力完爆所有答案（包括我的）加起来，实在是牛逼……==这题目都给写成这样了，我就不指望赞了。你们就当福利好了。这个回答里的图都是我自己画的，盗图必…… 算了你们想拿去玩就拿去吧……看到这个问题的时候我有点纠结问题里的最后一张图是怎么画的，不过仔细看了一下我觉得应该是二维空间里画的。所以 Asymptote 和 Metapost 都可以。对了补充一点，在我的另一个回答里（），我提到对于科研的价值，科研圈和大众的定义是不一样的。对于“漂亮的插图”也是一样。君不见大众媒体里少有数据图，就算有也是寥寥几笔，fancy 为主，使用符合当前大众审美的风格（比如现在是扁平、极简），测量从来不画 errorbar，甚至极简风格的连坐标轴都不画，一条颜色风骚的曲线牛逼闪闪。对于大众来说，看起来牛逼、fancy 才是漂亮。但是在科研圈里显然不是这样，而且不同的学科之间对图的严谨、清晰程度的要求也不一样。所以单纯地说一个插图“漂亮”其实没什么意义。——————————————
正文：我觉得这个问题让我答简直太合适了…… 只要是用来画图的玩意我基本都用过，也都会。这个回答主要介绍工具，为什么不说方法呢？因为感觉好像没什么好说的，你觉得什么地方难看，改一下就行了啊…… 从最简单的开始吧。菜鸟级：
Matlab, Mathematica 和 R 就不说了。Python 有个著名的库叫 Matplotlib, 主要用来数据作图，但本身带有层次较低的 API, 原则上可以用来画任意种类的图。这玩意自带 TeX 数学语法。数据作图效果这样：丧病一点可以这样：这种牛逼闪闪的等高线也是小意思~~这么多点也是没问题的：这玩意极其的灵活，比如 Mathematica 有个功能就是画函数曲线的时候自动选择合适的采样率，斜率或者曲率比较大的地方会自动使用高采样率。于是我在 Python 里也实现了一个，这样就可以用 Matplotlib 无脑画函数曲线了，比如这样：Gnuplot. 纯画图方面与 Matplotlib 不相上下，优点是快，超级快。图就不放了，和 Matplotlib 差不多。普通级：
Metapost. 脱离菜鸟级以后，我们离开了 API 和程序的地盘，开始撸绘图语言。首先当然要介绍大名鼎鼎的 Metapost. 这货的历史最早要追溯到 Knuth 大神设计的 Metafont, 但是 Metafont 是用来制作字体的，于是一帮人仿照 Metafont 设计了通用绘图语言 Metapost. 写程序画图相对于使用 GUI 工具来说最大的好处就是可以精确地控制，和自动化。这种绘图语言尤其适合画示意图。还是上图吧……费曼图什么的简直就是不在话下…… 其实我是不太明白为什么有些软件画出的费曼图那么难看的……然后这是我用 Metapost 给我的统计力学笔记撸的封面：Asymptote. 有一小撮人用 Metapost 不爽，毕竟语法太古老了，于是搞出了类 C++ 语法的面向对象语言 Asymptote, 也是醉了…… 除了写出来比 metapost 好看一些意外，基本上差不多：初中几何题都是可以的。这玩意比较逆天的功能是 3D 矢量作图~~ 你看我这么一比划，你不就知道面心立方的晶胞是什么样的了么~~你看我这么一笔划，你不就知道 RGB 空间是怎么嵌在 xyz 空间里的了么~~继续嗯，还有好多图懒得找了，Asymptote 就先这样吧。…… …… ……&更新 &
最近又折腾了一下传说中的 . 这个东西的核心实际上是一套 selector 实现和把数据绑定到 DOM 上的机制，非常紧凑。然后 HTML 的 DOM 里可以包含 SVG, 这就很好玩了。我试了一下数据作图然后顺便撸了个 , 你们可以玩玩~~ （暂不支持移动端……），长这样：看上去挺好用，对吧？但是！！这个东西其实并不是特别适合给论文出图，原因是你用的时候需要把 SVG 保存下来。SVG 是 DOM 的一部分，一般只能用 Javascript 把 SVG 序列化，然后抛出一个文件让你在浏览器里下载，或者打开一个新窗口你手动另存为什么的，这不是关键，关键是我们写 SVG 的时候经常会用 CSS 来指定样式，这样如果你需要所有的线都粗一点，只要改下 CSS 就好，不用碰逻辑。然而你序列化 SVG 的时候是没法同时序列化 CSS 的（吧？）……………………………………
&/更新&地狱级： 这个级别的工具当之无愧地给了 Postscript 这个基于堆栈的底层页面描述语言，这个语言是如此的强大，以至于 Adobe 后来不得不发展了简化版（更易于实现）：EPS 和 PDF.
这个语言的神奇之处就是它底层到用户几乎忘了它的存在，但同时它写起来却不是很费劲。如果你玩过 RPN 计算器，就很容易理解 PS 的逻辑。这玩意最大的好处它的语法十分简单，无论你用什么语言来计算，都可以方便地生成 PS 代码，而不需要考虑你用的语言是否有好用的绘图 API. 比如我之前玩元胞自动机的时候就可以用计算的代码直接生成图形：放大一点可以看到我在图上直接写了格点的编号，方便调试~~奇葩级：
最后这个级别主要是给一些特殊用途的工具。Graphviz. 这是一个图可视化工具包，可以可视化各种无向图和有向图。前几天我刚刚用它画过一个流程图：Blender. 这是一个自由的通用 3D 建模/着色/渲染/动画套件，我基本上是看着它一点点从一个土了吧唧的山寨三维软件逐渐进化成现在 Maya 级别的 3D 套件的。你们都在 Nature 杂志上见过那种很漂亮很 Fancy 但其实没什么用的三维渲染图对吧？我只能说…… 他们如果雇我画图的话会更漂亮更 fancy…不过在放 fancy 图以前，先放个看起来不那么 fancy 的：画这个图以前我以为在 Blender 里面放几个立方体几个球打开卡通渲染就行了……
我简直就是拿衣服。这货最后用了三个渲染层才搞定…… 如果有人知道更简单的方法请告诉我……下面放 fancy 图~~小清新洛伦兹吸引子：小清新某分子：这张图的源文件（分子略不同，注意有三个 scenes 需要渲染）：嗯，就先这样吧~~ 想起什么再更新……&更新&这两天在帮妹子折腾这样一个分子：最终在 node editor 里撸出了这个感觉放在文章里挺不错。方法是用一个 tonemapping node... 详情见 然后给妹子渲染的另一个：&/更新&更新：Pov-ray: 好像还没有回答里提及这个。这是一个场景描述语言 + 渲染器，那个渲染器还是不错的，就是比较慢。这玩意有两种用法：当渲染器用，主要是在别的 3D 软件中把场景导出成 pov 文件，然后直接渲染，没什么技术含量
把数学公式写进去画曲面。这个玩法比较特别，配合 pov 强大的渲染器可以撸一些非常怪异的东东，但是…… Blender 是有 Python API 的，所以其实 Pov-ray 能撸的 Blender 都能撸。我之前有一段时间特别痴迷这个，后来发现然并卵，用 Blender 就行了……
最后再把之前那个链接发一下： 实在是太牛逼，不服不行……4.4K215 条评论分享收藏感谢收起cad中怎么画个有尺寸的矩形 我标注--线性然后尺寸一出来就不见了
cad中怎么画个有尺寸的矩形 我标注--线性然后尺寸一出来就不见了好比说我想画个的矩形,不要画直线输入数值的,我要在命令行里输的那种有的时候我想标注一段线,结果我点标注---线性 然后尺寸就不见了,我看了不是对象捕捉的关系
输入命令rec回车,然后屏幕指定一个角点（也可以输入第一点坐标）,输入@回车就会得到你要的这个矩形.第二个问题没看太明白,可能是你的标注样式没有设置好
我有更好的回答：
剩余:2000字
与《cad中怎么画个有尺寸的矩形 我标注--线性然后尺寸一出来就不见了》相关的作业问题
不用分解输入倒角命令F,然后R 输入圆角半径.选择需要倒角的两条边.需要连续倒角可以在输了半径后输入U
如果是非标准的标注,即单个由于打断或延伸在图纸中省略图形,又想让标注反应实际尺寸,可采用手动修改标注文字命令,输入ED回车后选取标注字体即可修改,如果是标注的标注,只是图形按比例缩放了10倍或25倍,可在标注样式里进行修改,将标注样式比例按实际缩入的10倍或25倍进行设置,则标注就会按实际你要求的显示了.
这个图的画法原来回答了好多次!1、先画好五个相切的圆（半径随便定）2、画外切的矩形3、选择画好的矩形和五个圆一起按指定尺寸缩放
这里涉及到一个出图比例的问题,没有系统的概念说不清.只解释你的问题会改箭头大小~‘标注样式管理器’你应该是知道的了,点‘修改’标注样式,出来的界面中‘调整’选项卡~‘标注特征比例’选‘使用全局比例’然后将比例改到你需要出图的比例上.你的例子中,文字高度是3.5,然后比例选10（也就是1：10的意思）,此时文字在打印1：
第一步：先画出你需要的尺寸的矩形,位置随意.第二步：用直接链接这个矩形的两条对角线,两条对角线的交点就是这个矩形的中心点.第三步：打开F3对象步骤,用M移动 命令,选择这个矩形（注意：将两条对角线也选中）,选择“基点”为两条对角线的交点（也就是矩形的中点）.第四步：开始移动,让矩形的中点和你需要的某点 重合,最后用E删
百度一个回来修改尺寸不就行了
如果没有安装CAD二次开发软件,如天河CAD等,那么就比较麻烦了按照标准规定的尺寸画框图,然后保存为块,以后每次直接调用,就是这样了建议安装个二次开发软件 再问： 到哪里可以安装二次开发软件 请赐教 再答： 搜索“天河CAD” 如果你的CAD是2010版，就搜索天河CAD2010 网上很多的再问： 知道了 谢谢
先随便画正三角形,然后画外接圆,几次画好直到五边形,尺寸先不管,然后用缩放命令,有个参照知道的吧?使用参照将尺寸定为75
首先,画个R75的圆,然后在画个Rt三角形2直角边比例为2:1,其中三角形斜边的中点在圆心上,然后放大（sc）,基点为圆心（即斜边中点）,在放大比例中输入R（参照）第一点和第二点分别为斜边的2端点,之后输入尺寸150,这样这个三角形三个顶点都再圆上,且2直角边比例为2:1,.然后就可以画出你要的矩形了.画法比较复杂,
输入tan（寻找切点）,在圆上点一下,命令：指定下一点输入尺寸（例如20）,&20（与水平线角度输入）,完成.
选绘图-正多边形-输入边数5,选择圆心,选择内接还是外切圆,输入尺寸,ok
你可以先把弧长标注尺寸,然后按这个尺寸画线段就可以了啊
先画一条,旋转角度再画一条,再画一条,就是一条一条画
dal快捷键是量尺寸的也可以在工具栏中标注下选择对齐功能可以量斜线的尺寸
这个很有难度的,你去明经论坛找找有没有相关的插件吧.纯粹 cad 应该是没戏了.这有点几何画法的意思了. 再问： 就是啊 把我纠结得 。。。 再答： 再次细看了你的问题，你的问题是有疑问的，会存在多无穷多解的啊。 从基础几何分析吧: 1、固定两边就是意味着存在另外一边固定的可能，这有两种可能了。 2、假定一种可能就是五
坐标中间的隔开符号是逗号而不是点,你图上好像用的是点.如果还是不行,你用@100,200可以吗?你图上用的极坐标输入方法,要切换到极坐标模式,切换方法：在屏幕最下方,有个坐标方式切换按钮.极轴追踪：AutoCAD中的极轴功能就是可以沿某一角度追踪的功能.比如在鼠标接近水平或者垂直时系统会自动帮你定位到水平或者垂直位置.
%%p 绘制正/负公差符号 (±).注意的是要选对字体才能显示!再送你一点要%号才能打出来的(在帮助里复制的)下列控制代码可使用标准 AutoCAD 文字字体和 PostScript 字体：%%nnn 绘制字符数 nnn.这些控制代码只能使用标准 AutoCAD 文字字体：%%o 控制是否加上划线.%%u 控制是否加下
1.转动鼠标中键.2.使用scale命令,输入比例（放大>1,缩小
生成一个"字母.lin"文件.打开记事本,编辑该文件.输入如下内容*字母,---- wn ---- wn ---- wn ----A,12.7,-5.08,["wn",STANDARD,S=2.54,R=0.0,X=-2.54,Y=-1.27],-5.08保存.打开cad,格式-->线型,加载上述文件.点击“字母”画一随笔 - 77, 文章 - 0, 评论 - 72, 引用 - 0
接着之前的， 由于这个画已经画了很久了，这次一次性加了比较多更新，算是让这幅画告一段落吧。 本次的更新包括：
1. 给云增加动画
2. 画了一棵树
3. 树上画了一个苹果，并给苹果增加坠落的动画
其实还有一个TODO List， 不过这个List没有也可以算完成，所以这个List可能会无限期搁置：
1. 苹果坠落前左右摇晃一下
2. 苹果落地后滚动几圈
那么进入正题。
完整html如下：
1 &!DOCTYPE html&
2 &html lang="en"&
&meta charset="UTF-8"&
&title&Css Paint&/title&
&link rel="stylesheet" type="text/css" href="../../css/sun-house/sun.css" /&
&link rel="stylesheet" type="text/css" href="../../css/sun-house/house.css" /&
&link rel="stylesheet" type="text/css" href="../../css/sun-house/human.css" /&
&link rel="stylesheet" type="text/css" href="../../css/sun-house/cloud.css" /&
&link rel="stylesheet" type="text/css" href="../../css/sun-house/tree.css"&
&link rel="stylesheet" type="text/css" href="../../css/sun-house/apple.css"&
&link rel="stylesheet" type="text/css" href="../../css/sun-house/human-animate.css" /&
&link rel="stylesheet" type="text/css" href="../../css/sun-house/cloud-animate.css" /&
&script type="text/javascript" src="js/analysis.js"&&/script&
17 &/head&
&div class="sun"&
&div class="sun-body"&&/div&
&div class="sun-shine-light sun-shine-light1"&&/div&
&div class="sun-shine-light sun-shine-light2"&&/div&
&div class="sun-shine-light sun-shine-light3"&&/div&
&div class="sun-shine-light sun-shine-light4"&&/div&
&div class="sun-shine-light sun-shine-light5"&&/div&
&div class="house-width house"&
&div class="house-width house-roof house-roof-left"&&/div&
&div class="house-width house-roof house-roof-right"&&/div&
&div class="house-width house-wall"&
&div class="house-wall-door"&
&div class="house-wall-door-handle"&&/div&
&div class="human human-pos-1"&
&p class="lines human-speak"&大家好，我叫小明。&/p&
&p class="lines human-speak human-speak-delay-3"&我是一个程序员，最喜欢宅在家里LOL。&/p&
&p class="lines human-speak human-speak-delay-12"&静静，我们交个朋友好吗？我的电话是。&/p&
&div class="human-head-normal"&&/div&
&div class="human-body-normal"&&/div&
&div class="human-arms-normal"&&/div&
&div class="human-legs-normal"&&/div&
&div class="human human-pos-2"&
&p class="lines human-speak human-speak-delay-6"&大家好，我叫静静&/p&
&p class="lines human-speak human-speak-delay-9"&和大家看到的一样，我热爱舞蹈。&/p&
&p class="lines human-speak human-speak-delay-15"&不要，程序员什么的最讨厌了！&/p&
&div class="human-head-normal"&&/div&
&div class="human-body-normal"&&/div&
&div class="human-arms-normal"&&/div&
&div class="human-legs-1"&&/div&
&div class="cloud cloud-pos cloud-pos-1 cloud-animate-1"&
&div class="cloud-pos cloud-border cloud-bg cloud-top"&&/div&
&div class="cloud-pos cloud-border cloud-bg cloud-left"&&/div&
&div class="cloud-pos cloud-border cloud-bg cloud-right"&&/div&
&div class="cloud-pos cloud-border cloud-bg cloud-bottom"&&/div&
&div class="cloud cloud-pos cloud-pos-2 cloud-animate-2"&
&div class="cloud-pos cloud-border cloud-bg cloud-top"&&/div&
&div class="cloud-pos cloud-border cloud-bg cloud-left"&&/div&
&div class="cloud-pos cloud-border cloud-bg cloud-right"&&/div&
&div class="cloud-pos cloud-border cloud-bg cloud-bottom"&&/div&
&div class="tree"&
&div class="tree-top"&
&div class="tree-crowwn tree-crowwn-left"&&/div&
&div class="tree-crowwn tree-crowwn-top"&&/div&
&div class="tree-crowwn tree-crowwn-right"&&/div&
&div class="tree-crowwn tree-crowwn-bottom"&&/div&
&div class="tree-middle"&
&div class="tree-trunk"&&/div&
&div class="tree-bottom"&
&div class="tree-root tree-root-left"&&/div&
&div class="tree-root tree-root-middle"&&/div&
&div class="tree-root tree-root-right"&&/div&
&!-- TODO:
1.苹果左右震动一下再下跌
2.苹果跌下来后向左滚动几圈 --&
&div class="apple"&
&div class="apple-body apple-left"&&/div&
&div class="apple-body apple-right"&&/div&
&div class="apple-stalk"&&/div&
94 &/body&
95 &/html&
&增加的css如下：
1 .cloud-animate-1 {
-webkit-animation-duration: 20s;
-webkit-animation-name: cloudMove-1;
-webkit-animation-iteration-count: infinite;
-webkit-animation-direction: alternate;
8 .cloud-animate-2 {
-webkit-animation-duration: 20s;
-webkit-animation-name: cloudMove-2;
-webkit-animation-iteration-count: infinite;
-webkit-animation-direction: alternate;
15 @-webkit-keyframes cloudMove-1 {
top : 10px;
top: 50px;
top: 20px;
33 @-webkit-keyframes cloudMove-2 {
top : 30px;
top: 80px;
top: 10px;
could-animate
bottom: 10px;
height: 700px;
position: absolute;
right: 120px;
width: 500px;
9 .tree-crowwn {
background-color: green;
border-radius: 50%;
position: absolute;
z-index: 2;
16 .tree-crowwn-left {
height: 250px;
top: 150px;
width: 250px;
22 .tree-crowwn-top {
height: 320px;
left: 100px;
width: 320px;
28 .tree-crowwn-right {
height: 250px;
left: 250px;
top: 150px;
width: 250px;
35 .tree-crowwn-bottom {
height: 120px;
left: 150px;
top: 270px;
width: 200px;
42 .tree-trunk {
background-color: #5d2323;
height: 280px;
left: 170px;
position: absolute;
top: 350px;
width: 180px;
z-index: 1;
52 .tree-bottom {
position: absolute;
top: 630px;
57 .tree-root {
background-color: #503333;
height: 30px;
position: absolute;
width: 20px;
64 .tree-root-left {
left: 170px;
-webkit-transform: matrix(1, 0, -0.5, 1, 0, 0);
-webkit-transform-origin: right top;
70 .tree-root-middle {
left: 250px;
-webkit-transform: matrix(1, 0, -0.1, 1, 0, 0);
75 .tree-root-right {
left: 330px;
-webkit-transform: matrix(1, 0, 0.5, 1, 0, 0);
-webkit-transform-origin: left top;
1 .apple {
bottom: 360px;
height: 60px;
position: absolute;
right: 480px;
width: 60px;
z-index: 3;
-webkit-animation-duration: 1.5s;
-webkit-animation-delay: 18s;
-webkit-animation-name: appleDrop;
-webkit-animation-timing-function: cubic-bezier(0.5, 0.1, 0.85, 0.3);
-webkit-animation-fill-mode: forwards;
16 .apple-body {
background-color: #ff3300;
border-radius: 75% 75% 90% 90%;
height: 50px;
position: absolute;
width: 37px;
z-index: 3;
25 .apple-left {
29 .apple-right {
right:2px;
33 .apple-stalk {
border: none;
border-radius: 100%;
border-right: 3px solid #000;
height:20px;
left: 8px;
position: absolute;
top:-10px;
width:20px;
z-index: 2;
45 @-webkit-keyframes appleDrop{
bottom: 35px;
这里用到的陌生的css属性包括(直接附上相关的MDN文档链接）：
1. &- 代表动画执行的次数，默认值为1。值可以是非负整数或infinite关键字， infinite表示执行无数次。
2.&&- 代表关键帧的运行方向，默认值为normal。 可选的值共包括：
normal：正向执行，顺序为从from(0%)执行到to(100%)。
reverse： 反向执行，顺序为从to(100%)执行到from(0%)。
alternate: 先正向执行再反向执行，也可以理解为奇数次时正向执行， 偶数次时反向执行。
alternate-reverse： 和alternate相反，先反向执行再正向执行。
3.&&- MDN文档说该属性用于定义动画在周期中执行的节奏，我的理解是用于定义动画中帧之间属性的变化速率。 默认值是ease(缓动-先加速再减速）。
　　通常可以用简写来指定， 常用的简写有缓动（ease,ease-in,ease-out,ease-in-out）和匀速（linear）。 除了关键字外，还有稍微特殊的设置：
steps : 语法为 steps(N, target) , N为正整数， target为目标，可以设置start或end（其他值没试过，文档中也没提到）。 意思就是， 不匀速的分N次到达start。 这里举个
cubic-bezier： ，语法为&cubic-bezier(x1, y1, x2, y2)， 其中四个参数都是小数，可以为负数。 通过x和y坐标，定出2个点，通过这两个点，描述一个变化曲线。还没深入研究过，这里暂不多谈。前面的链接是百度百科的，有兴趣可以看看。今天搜到一个不错的网站，可以用来感受一下贝塞尔曲线在动画上的实际效果：&。 平时写动画时也可以借助这个网站，不用辛苦的调半天数字。
　　想深入了解这个属性，建议找找更深入的文章，这里只是浅尝辄止 &：）
4.&&- 用于声明动画执行结束后的目标样式，默认值为none。该值受animation-direction和 animation-iteration-count值的影响。 若animation-iteration-count的值是infinite，动画不会结束，则该属性无效。
　　可选值包括：
　　none - 动画结束后，不采用动画关键帧设置的样式。
　　forward - 采用动画最后一帧时的样式
　　backward - 采用动画第一帧时的样式
　　both - 同时采用动画第一帧和最后一帧时的样式。 但值有冲突的属性不知道会如何处理。
　　关键帧的设置中，第一帧不一定是from(0%),最后一帧并不一定是to(100%), 具体情况如下表，以下表格是我翻译MDN中得来的：
animation-directionanimation-iteration-count第一帧最后一帧
0%&or&from
100%&or&to
100%&or&to
0%&or&from
0%&or&from
0%&or&from
0%&or&from
100%&or&to
alternate-reverse
100%&or&to
100%&or&to
alternate-reverse
100%&or&to
0%&or&from
PS： 以上四个属性和animation-name一样，都可以以逗号分隔设置多个值，每个值用于描述animation-name中相同位置的动画规则。animation-name，关键帧的简要信息可以查看
说完基础， 说下我是怎么画的。
1. 云的飘动： 用animation-direction设置动画会来回执行，用animation-iteration-count设置无限次执行。
2. 树： 用四个圆形组成树冠， 矩形组成树干， 3个倾斜的矩形组成3个树根。
3. 苹果： 用两个圆形组成苹果的果肉部分，用一个原型的div的border-right画出苹果的梗。 用animation-delay设置延迟执行动画， 用animation-timing-function让下落模仿自由落体的加速度， 用animation-fill-mode让苹果落地后停在那里。
好了， 今天就到这里， 这幅sun-house的画也告一段落。 以后再看看画些啥吧。 谢谢阅读。
转载请注明出处：}