CSS 코드의 각 속성

오늘 알아볼 내용은 수정된 CSS 코드의 각 속성 설명입니다.
이 코드는 .entry-content 클래스 안의 h2 태그에 스타일을 적용하는 것입니다.

---

✅ 전체 코드

.entry-content h2 {
  clear: both;
  font-size: 1.5em;
  line-height: 1.5;
  color: rgb(14, 13, 13);
  margin: 0.5em 0em;
  padding: 15px 20px;
  background: linear-gradient(to right, #fdefc7, #f8cf5d); 
  border-radius: 25px 2px 25px 2px;
}

---

🧩 코드 설명

속성	설명
.entry-content h2	.entry-content 클래스 안에 있는 모든 <h2> 태그에 적용됩니다.
clear: both;	이 요소 위나 아래에 float된 요소가 있을 경우, 겹치지 않게 아래로 밀어냅니다. 레이아웃이 깨지지 않게 정리해줍니다.
font-size: 1.5em;	글자 크기를 부모 요소의 1.5배 크기로 설정합니다.
line-height: 1.5;	줄 간 간격을 1.5배로 설정하여 읽기 쉽게 만듭니다.
color: rgb(14, 13, 13);	글자 색을 아주 진한 회색(거의 검정)으로 설정합니다.
margin: 0.5em 0em;	위/아래는 0.5em, 좌/우는 0em의 바깥 여백을 줍니다.
padding: 15px 20px;	안쪽 여백을 위아래 15px, 좌우 20px로 설정합니다. 글자와 테두리 사이 간격을 만듭니다.
background: linear-gradient(to right, #fdefc7, #f8cf5d);	왼쪽에서 오른쪽으로 부드럽게 색이 바뀌는 배경을 적용합니다. 연한 노란색 → 진한 노란색으로 변합니다.
border-radius: 25px 2px 25px 2px;	모서리를 둥글게 만듭니다. 각 코너의 반경이 다릅니다 (위왼 25px, 위오른 2px, 아래오른 25px, 아래왼 2px). 재미있는 시각 효과를 줄 수 있습니다.