效果图如下：

先新建一个视图页面，将视图页面的背景颜色设置为黑色

绘制一个正方形的元素，元素拉动的过程中可以按住SHIFT键，或绘制完成之后在属性面板中设置宽度和高度。

高度为：279px，宽度为：279px。这里我们绘制的是一个“POSITION”div（DIV的position：absolute）

LEFT和TOP分别为：503px、235px，将它的背景设置为白色。

再绘制一个正方形的POSTION元素，宽度为：234px，高度为：327px，LEFT和TOP分别为：575px、215px，并将它的背景设置为黑色。

保存预览。

脚本如下：

 
 <div class="moon1">
	 <div>
	 </div>
 </div>
 <div class="moon2">
	 <div>
	 </div>
 </div>

body{background-color:#000000;}
.moon1{width:200px;height:200px;margin-top:165px;margin-left:582px;background-color:#ffffff;
border-radius:100%;transform:rotate(-15deg) ;transform-origin:center center;}
.moon1>div{width:200px;height:200px;margin-top:0px;margin-left:38px;
background-color:#000000;border-radius:50%;}
.moon2{width:200px;height:76px;margin-top:97px;margin-left:570px;
padding-top:124px;background-color:#ffffff;border-radius:50%;}
.moon2>div{width:100px;height:100px;margin-left:136px;
background-color:#000000;border-radius:50%;}

点击下载脚本