ryan_index.html

<!doctype html>
<html>
<head>
  <meta charset='utf-8'>
  <title>drawing - ryan</title>
  
  <link rel="stylesheet" href="css/ryan_style.css"/>
  
</head>
<body>
  <!-- HTML 구조 잡기-->
  <div class="ryan"> <!-- 라이언 -->
    <div class="ear left"></div> <!-- 왼쪽 귀 -->
    <div class="ear right"></div><!-- 오른쪽 귀 -->
<!-- 두가지 이상의 클래스를 사용할 경우

     중간에 공백을 넣어줘야 함 즉, 이렇게 되면
     .ear을 통해서 귀의 공통 스타일을 적어줄 수 있음 -->

    <div class="face"> <!-- 라이언의 얼굴-->
      <div class="eyebrow left"></div> <!-- 왼쪽 눈썹 -->
      <div class="eyebrow right"></div> <!-- 오른쪽 눈썹 -->
      
      <div class="eye left"></div> <!-- 왼쪽 눈 -->
      <div class="eye right"></div> <!-- 오른쪽 눈 -->
      
      <div class="nose"></div> <!-- 코 -->
      
      <div class="mouth left"></div> <!-- 입 좌측부분 -->
      <div class="mouth right"></div> <!-- 입 우측부분 -->
      
    </div>
    
  </div>
</body>
</html>