[分享]CSS3教程画画眼睛上色

CSS3教程可以帮助我们画画眼睛上色，以下是需要使用到的一些CSS3属性：

/* 定义颜色变量 */
--iris-color: #4891d9;
--pupil-color: #222222;

/* 绘制眼球 */
.eye {
  width: 80px;
  height: 80px;
  background-color: #f1f1f1;
  border-radius: 50%;
  position: relative;
  overflow: hidden;
}

/* 绘制虹膜 */
.iris {
  width: 60px;
  height: 60px;
  background-color: var(--iris-color);
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* 绘制瞳孔 */
.pupil {
  width: 30px;
  height: 30px;
  background-color: var(--pupil-color);
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
} 

以上是CSS3教程中绘制眼睛上色的基础代码，我们可以通过调整颜色变量来改变眼睛的颜色，例如：

.iris {
  /* 改变虹膜颜色 */
  background-color: #72bd63;
}

.pupil {
  /* 改变瞳孔颜色 */
  background-color: #ffffff;
} 

这样就能够轻松地绘制出不同颜色的眼睛啦！