Ch_12 Table

✔️ border-collapse

#movies {
  border-collapse: collapse;
  width: 100%;
}
#movies td,
#movies th {
  border: 1px solid #798bff;
  padding: 8px;
}
#movies th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: green;
  color: white;
}
#movies tr:nth-child(even) {
  background-color: rgb(155, 155, 155);
}
#movies tr:hover {
  background-color: rgb(201, 201, 201);
}

오른쪽이 적용한 표.
난 왼쪽이 더 좋다 핳

✔️ padding 안쪽 여백

th{
padding: 8px;
}

th {
padding-top: 12px;     /* 위 */
padding-bottom: 12px;  /* 아래*/
}

• 설정 전
  

• padding: 8px; 설정
  

✔️ color

th {
background-color: green; /* 배경색 */
color: white;  			 /* 글자색 */ 
}

✔️ selector

/* 짝수행 배경 회색 */
#movies tr:nth-child(even) {
  background-color: rgb(155, 155, 155);
}
 /* 마우스 오버 시 밝은 회색*/
#movies tr:hover {
  background-color: rgb(201, 201, 201);
}