CSS学习3

CSS 中 border: 1px solid rgba(0, 0, 0, 0.1); 是什么意思？

意思是: 设定元素的边框为 1 像素宽、实线、颜色使用 rgba 来表达。

其中，rgba 是 CSS3 中的属性。rgba 括号中前 3 个数字代表着 red green blue 三种颜色的 rgb 值（0-255），最后一个是设定这个颜色的透明度即 alpha 值。范围从 0 到 1，越接近 1，代表透明度越低。

写 box-shadow 的依次顺序为：

h-shadow   v-shadow   blur   spread   color   insect

水平阴影    垂直阴影   模糊    阴影尺寸  颜色   外阴影转到内阴影 

绘制太阳系各大行星运行轨迹：

<div class="solarsys">
  <!--太阳-->
  <div class='sun'></div>

  <!--水星轨道-->
  <div class='mercuryOrbit'></div>

  <!--水星-->
  <div class='mercury'></div>

  <!--金星轨道-->
  <div class='venusOrbit'></div>

  <!--金星-->
  <div class='venus'></div>

  <!--地球轨道-->
  <div class='earthOrbit'></div>

  <!--地球-->
  <div class='earth'></div>

  <!--火星轨道-->
  <div class='marsOrbit'></div>

  <!--火星-->
  <div class='mars'></div>

  <!--木星轨道-->
  <div class='jupiterOrbit'></div>

  <!--木星-->
  <div class='jupiter'></div>

  <!--土星轨道-->
  <div class='saturnOrbit'></div>

  <!--土星-->
  <div class='saturn'></div>

  <!--天王星轨道-->
  <div class='uranusOrbit'></div>

  <!--天王星-->
  <div class='uranus'></div>

  <!--海王星轨道-->
  <div class='neptuneOrbit'></div>

  <!--海王星-->
  <div class='neptune'></div>
</div>